Durandal 多个母版页

Question

我正在开发一个想要使用多个主视图的 SPA。这是我的用例：

我有一个拥有个人资料页面的用户。在该个人资料页面中，我希望能够显示几个不同的视图，即。详细信息、作品、联系信息等。我需要能够深度链接到这些视图中的每一个。这些视图中的每一个都必须显示主布局视图中的基本用户数据。

据我了解，我应该为此使用 compose，并且我有一些似乎可以工作的代码，但是，我希望能够将数据从“辅助 shell”传递到实际的子视图。 splat 数据似乎没有传递给子视图模型的激活方法。

在我的“主”视图模型中，我创建了一个名为 activeView 的可观察对象，其中包含对应于子视图模型（视图模型/用户/详细信息）的字符串。然后我有一个淘汰声明如下：

<!-- ko compose: {
    model: activeView(),        
    activate: true
} --><!-- /ko -->

如何将数据传递给子视图？或者有更好的方法吗？

提前致谢！

Answer 1

根据我的说法，ko.compose 不是那么动态的，并且似乎像 Razor 的布局一样工作。 使用 durandal，最好尽可能地制作单独的视图，然后将它们链接到路由器。我正在使用 John Papa 的热毛巾模板； 我的建议涉及通过 durandal 路由器和淘汰赛传递数据（不仅仅是 id）。

初始化应用时（shell.js、main.js、...） 将您的路线映射到某处（shell.js 或 main.js），并设置最终过滤。 对于将传输数据的路由，使用 (:id) 提案构建它们

router.mapRoute('view/:id', moduleId, 'Customer Details', false);

何时何地需要一些路线 您可以查看 Joseph Gabriel 的解决方案 (https://stackoverflow.com/a/16036439/2198331) 来过滤您的路线，以便在您需要的时间和地点使用它们。过滤路由后，您可以破解 routeInfo 来传输您的参数（字符串或对象，如 selectedItem）。

arearoutes = ko.utils.arrayFilter(router.visibleRoutes(), function (route) {
              // mgpe has been set at app init
                return route.settings.mgpe === 112; 
             });

使用您要传输的数据从过滤器的结果中扩展您的 routeInfo

areaRoutes.forEach(function(ar){
     ar.myItem = mydata; // or vm.selectedItem(); DEPARTURE LUGGAGE
}, areaRoutes);

您的 (myItem) 现在已按照您的喜好附加到这些路线 这个或这些路由将随身携带您的数据，并且永远不会丢失数据，除非您更新了路由器的相同对象 (myItem)

function activate(adata){
       vm.arrivalData(adata.routeInfo.myItem);  // ARRIVAL LUGGAGE are here
}

路由可以携带嵌套路由 用于嵌套上下文，如嵌套菜单；当父路线处于活动状态时，您可以通过准备旅行来玩子路线：

router.activeItem.settings.areSameItem = function (currentItem, newItem, activationData) {
   mybag = activationData.routeInfo; // TRAVEL (current) LUGGAGE are present here
}

注意： 在使用此解决方法之前，您必须考虑安全问题，由于我是 durandal 新手，我不知道这是否不会对路由器的路由生命周期造成严重后果。还要注意对象的名称，因为它在路由器的路由生存期间永久保留。

Answer 2

如何创建一个用户对象并在每个视图模型中都需要它？最简单的方法是将其附加到应用程序（即 app.user = ）对所述用户对象中的任何可观察对象所做的更改将更新到您的 SPA 中的每个视图和视图模型。

这样你就可以利用淘汰赛库的 sub/pub 的功能