Durandal 多个母版页 [英] Durandal Multiple Master Pages

问题描述

我正在开发一个 SPA，我想使用多个主视图.这是我的用例:

I am working on a SPA that I would like to use multiple master views. Here is my use case:

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

I have a user that has a profile page. Within that profile page I would like to be able to display a couple of different views, ie. details, works, contact info, etc. I need to be able to deep link to each of these views. Each of these views must display the basic user data from the master layout view.

我的理解是我应该为此使用 compose 并且我有一些似乎可以工作的代码，但是，我希望能够将数据从辅助外壳"传递到实际的子视图.好像splat数据没有传递给子viewmodel的activate方法.

It is my understanding that I should be using compose for this and I have a bit of code that seems to work, however, I want to be able to pass data from the "secondary shell" down to the actual sub view. It seems that the splat data is not passed along to the activate method of the sub viewmodel.

在我的主"视图模型中，我创建了一个名为 activeView 的可观察对象，其中包含与子视图模型(视图模型/用户/详细信息)对应的字符串.然后我有一个淘汰赛声明如下:

In my "master" viewmodel I have created an observable called activeView that contains a string corresponding to a sub viewmodel (viewmodels/user/details). I then have a knockout statement that is as follows:

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

如何将数据传递给子视图?或者有没有更好的方法来做到这一点?

How can I pass data to the sub view? Or is there a better way to do this?

提前致谢！

推荐答案

在我看来，ko.compose 并不是那么动态，而且似乎像 Razor 的布局一样工作.使用 durandal 最好制作单独的视图，然后将它们链接到路由器.我正在使用 John Papa 的 Hot-Towel 模板；我的建议涉及使用 durandal 路由器和淘汰赛传递数据(而不是 id).

According to me, ko.compose is not so dynamic and seems to work like Razor's layout. With durandal it's better to make separate views as you can and then, link them to the router. I'm working with John Papa's Hot-Towel template; My proposal concerns passing data (more than id) with durandal router and knockout.

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

When initializing your app (shell.js, main.js, ...) map your routes somewhere (shell.js or main.js) with settings for eventually filtering. For routes which will transport data, built them with the (:id) proposal

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

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

Where and when some routes needed You can have a look to Joseph Gabriel's solution (https://stackoverflow.com/a/16036439/2198331) to filter your routes for use where and when you need them. After you filter the routes, you can hack routeInfo to transport your parameters (strings or objects like selectedItem).

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

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

extend your routeInfo from filter's results with the data you want to transport

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

您的 (myItem) 现在可以随心所欲地附加到这些路线上这个或这些路由将随身携带您的数据并且永远不会丢失它，除非您更新路由器的相同对象 (myItem)

Your (myItem) is now attached to these routes as so as you like This or these route(s) will carry your data with them and will never lost it unless you updated the same object of the router (myItem)

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

路由可以携带嵌套路由对嵌套上下文(如嵌套菜单)很有用；当父路线处于活动状态时，您可以通过准备旅行来玩儿童路线:

a route can carry nested routes Useful for nested context like nested menus; you can play with children routes by preparing the travel when a parent route is active :

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

注意: 在使用此变通方法之前，您必须考虑安全问题，因为我是 durandal 的新手，我不知道这是否会在路由器的路由生命周期中带来严重后果.还要注意对象的名称，因为它在路由器的路由生存期间永久停留.

N.B. : before use this work-around you have to consider the security issue and as I'm new to durandal I don't know if this will not bring serious consequences at the router's route life-cycle. Also be aware with object's names as its stay permanently during the router's route living.

这篇关于Durandal 多个母版页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！