在某个事件之后启用durandal路由器导航属性

Question

我定义了多条路线。其中一条路线是我的主路线，它在应用程序启动时加载，只有这条路线设置nav: true;所有其他路线都设置为nav: false;

在默认路由的html页面上，用户必须加载数据库数据。仅在加载数据库数据时，所有其他nav: false;的路由都应设置为true。

 function databaseDataLoaded() {

        for (var i = 0; i < router.routes.length; i++) {
            router.routes[i].nav = true;
        }
    }

当调用上述方法渲染导航的超链接时，它们不会被渲染。问题是我的router.map函数只是采用常见的对象文字，而不是淘汰observables？或者在durandal架构中有更好的方法来处理这样的场景吗？

Answer 1

对于使用Sammy.js路由器的Durandal 1.X，我的答案是正确的（我还没有使用2.0路由器来测试任何东西）

问题是，当您映射路由时，路由的属性不是可观察的。路由器获取您想要映射的路由并映射它们，当需要映射其他路由时，您需要返回并路由它们。

示例 -

    router.map({
        url: 'home',
        moduleId: 'viewmodels/home',
        name: 'Home',
        visible: true,
        settings: {}
    });
    return router.activate('home');

并在加载数据后，再加载其他路径 -

var newRoutes = [{
    url: 'other',
    moduleId: 'viewmodels/other',
    name: 'Other',
    visible: true,
    settings: {}
}, {
    url: 'about',
    moduleId: 'viewmodels/about',
    name: 'About',
    visible: true,
    settings: {}
}];
router.map(newRoutes );

修改

如果您担心放置路线的位置，只需将数据加载到config.js时加载您要加载的所有路线，并仅在应用启动时加载第一条路线。示例 -

shell.js

function activate() {
    datacontext.loadData().then(loadAllRoutes);
    router.map({
        url: 'home',
        moduleId: 'viewmodels/home',
        name: 'Home',
        visible: true,
        settings: {}
    });
    return router.activate('home');
}

function loadAllRoutes() {
    var routes = config.routes;
    router.map(routes);
}

替代

如果您想根据不同的事件隐藏/显示路线，但仍然同时加载它们，只需使用您的NavBar获得更多创意。可见性切换仍设置为可见，但您可以使用类似

的内容

<ul class="nav">
    // Show home route always
    <li>Home</li>
    <!-- ko foreach: visibleRoutes -->
    <li>(Put routes here)</li>
    <!-- /ko -->
</ul>

并在shell中创建一个observable，在数据加载完成后将dataLoaded从false更改为true。

var dataLoaded = ko.observable(false);
function activate() {
    datacontext.loadData().then(loadAllRoutes);
    var routes = config.routes;
    router.map(routes);
    return router.activate(config.startModule);
}

function loadAllRoutes() {
    dataLoaded(true);
}