Question

我试图在shell的标题中实现依赖于上下文的工具栏。目标是将特定于页面的工具栏视图绑定到当前视图模型，而不是shell或单独的工具栏vm。（有点像使用asp.net Razor语法的布局中的@RenderSection）。

当激活当前视图模型时，我会触发一条消息，其中包含描述工具栏视图位置的对象文字，并且它的视图模型应为this。

    function activate() {
        app.trigger('toolbar', { view: 'views/ediToolbar', model: this });
    }

shell正确侦听并更新activeToolbar绑定，但在此过程中调用vm上的activate方法创建无限循环。有没有办法防止无限循环，或者我是否完全以错误的方式解决这个问题？

shell.js

activeToolbar = ko.observable();

function activate() {
    // normal setup stuff
    app.on('toolbar', function(data) {
        activeToolbar(data)
    }
}

shell.html

<div data-bind="if: activeToolbar" class="toolbar">
    <!-- ko compose: { view: activeToolbar().view, model: activeToolbar().model } -->
    <!-- /ko -->
</div>

Answer 1

我应该更加关注侧栏中的相关SO问题！ This one给了我所需的线索。

在撰写绑定集中，激活为false：

<!-- ko compose: { view: activeToolbar().view, model: activeToolbar().model, activate: false } -->
<!-- /ko -->

Answer 2

实际上，将activate设置为false不是解决方案。并不是的。问题出在你的架构上。我们做同样的事情。我们的方法是，我们只需将导航菜单设置为托管视图的可组合部分（而不是shell）。没有必要让shell参与其中，除非它需要为每个模块的上下文工具栏提供帮助或提供托管站点。

Answer 3

您可以让您的viewmodel直接访问activate函数中的工具栏并使用自身更新observable（使用require，模块将会出现，因此您可以直接访问它们的属性）。然后从工具栏中，您可以将视图绑定到该可观察对象。

这样的事情：

function activate()
{
    toolbar.activeViewModel(this);
}

在shell标头中显示一个工具栏，该工具栏绑定到Durandal中的当前viewmodel

3 个答案: