Durandal - 根据 url 或路线隐藏页面部分

Durandal - hide section of page depending on url or route

在我的 durandal 应用程序中,除主页外的每个页面都有一个左侧导航栏。这个左边的导航栏应该在刷新时更新,尽管它应该驻留在 shell.html.

问题是我无法在主页上正确隐藏它。当我在主页上时,我可以使用 jquery hide() 方法隐藏 leftnav div,但问题是我只能在数据绑定后使用 jquery 代码,直到我可以看到导航栏。我尝试使用 durandal 组合,但我不确定如何仅在主页中隐藏导航栏,因为我不知道如何知道我是否在主页上或不在 shell.js 内。

有什么想法吗?

在您的视图模型中,您需要通过创建一个侦听当前指令值的计算来连接到您的路由器:

var ko = require('knockout');
var router = require('plugins/router');

function viewModel() {
    this.currentRoute = ko.computed(function() {
        return router.activeInstruction().fragment;
    });
}

然后您可以在视图中使用可见绑定来引用此变量。

<!-- home route only -->
<div data-bind="visible: currentRoute() == 'home'></div>

<!-- non-home routes -->
<div data-bind="visible: currentRoute() != 'home'></div>

如果您需要更复杂的逻辑,您可以创建一个特殊的计算函数来对当前路由进行特定测试并改为引用该变量。例如:

this.isSpecialRoute = ko.computed(function() {
    var re = /matchspecialroute/;
    return re.test(this.currentRoute());
}, this);