1

shell.htmlfor HotTowel 模板中,我们有:

    <!--ko compose: {model: router.activeItem, 
        afterCompose: router.afterCompose, 
        transition: 'entrance'} -->
    <!--/ko-->

这将按照惯例自动插入正确的视图。我正在尝试根据用户在 HotTowel/Durandal 应用程序中的角色注入不同的视图。例如,我有两个视图,

  1. productEditor_Admin.html
  2. productEditor_Superviser.html(不是这两个视图,我以前只有 productEditor.html,按照惯例,一切正常)

并且只有一个 ViewModel:

  1. 产品编辑器.js

现在,我想要一个函数productEditor.js,让我根据用户的角色决定插入哪个视图。我在Composition 文档中看到,我们可以做到,function strategy(settings) : promise但我不确定在 HotTowel 模板中实现此目的的最佳方法是什么。有人已经尝试过并得到答案吗?

4

2 回答 2

3

可以在视图模型中返回一个“viewUrl”属性,所以希望像下面这样的东西会打开门 ;-)。

define(function () {
    viewUrl = function () {
        var role = 'role2'; //Hardcoded for demo

        var roleViewMap = {
            'default': 'samples/viewComposition/dFiddle/index.html',
            role1: 'samples/viewComposition/dFiddle/role1.html',
            role2: 'samples/viewComposition/dFiddle/role2.html'
        };

        return roleViewMap[role];

    }

    return {
        viewUrl: viewUrl(),
        propertyOne: 'This is a databound property from the root context.',
        propertyTwo: 'This property demonstrates that binding contexts flow through composed views.'
    };
});
于 2013-05-10T13:07:10.030 回答
0

您是否在 PluralSight 上查看过 John Papa 的 JumpStart 课程。

在此处查看该应用程序的源代码:https ://github.com/johnpapa/PluralsightSpaJumpStartFinal

在 App/Config.js 文件中,他添加了其他默认可见的路由:

 var routes = [{
        url: 'sessions',
        moduleId: 'viewmodels/sessions',
        name: 'Sessions',
        visible: true,
        caption: 'Sessions',
        settings: { caption: '<i class="icon-book"></i> Sessions' }
        }, {
        url: 'speakers',
        moduleId: 'viewmodels/speakers',
        name: 'Speakers',
        caption: 'Speakers',
        visible: true,
        settings: { caption: '<i class="icon-user"></i> Speakers' }
        }, {
        url: 'sessiondetail/:id',
        moduleId: 'viewmodels/sessiondetail',
        name: 'Edit Session',
        caption: 'Edit Session',
        visible: false
    }, {
        url: 'sessionadd',
        moduleId: 'viewmodels/sessionadd',
        name: 'Add Session',
        visible: false,
        caption: 'Add Session',
        settings: { admin: true, caption: '<i class="icon-plus"></i> Add Session' }
    }];

您可以使用相同的逻辑将路由添加到此处的两个视图,然后在您的 productEditor.js 中,您可以决定导航哪个视图并使用 router.navigateTo() 方法导航到该视图。

于 2013-05-09T21:56:25.433 回答