杜兰达尔/淘汰赛。更新其他视图/视图模型

Posted 2023-03-27

【中文标题】杜兰达尔/淘汰赛。更新其他视图/视图模型

【英文标题】：Durandal/Knockout. Update other view/viewmodel

【发布时间】：2013-07-20 20:49:07

【问题描述】：

Durandal 有一个名为 shell 的基础视图。

我在其上添加了一个搜索框，以允许管理员/质量保证用户模仿任何系统用户。 在按钮上单击我希望能够更新当前显示的任何视图的视图。

贝壳（蓝色） 查看（红色）

我将如何着手，在我的子视图上公开一个函数，以便我可以从 shell 调用它，或者从子视图挂钩到 shell 的按钮单击事件。

问题：

Durandal 是否公开了我可以用来冒泡或将事件传递给不同视图或父容器的任何钩子？

【参考方案1】：

假设您有多个子视图并且不想在 shell 和子视图之间引入依赖关系，最好使用 Durandal 的事件系统。 shell 视图将成为发布者，子视图将成为订阅者。

查看http://dfiddle.github.io/dFiddle-1.2/#/event-aggregator/dFiddle 以获得工作演示。

publisher.js

define(['durandal/app'], function (app) 

    var message = ko.observable();
    var canPublish = ko.computed(function () 
        return message() ? true : false;
    );

    return 
        message: message,
        canPublish:canPublish,
        publish: function () 
            app.trigger('sample:event', message());
        
    ;
);

subscriber.js

define(['durandal/app'], function (app) 

    return 
        received: ko.observableArray([]),
        subscription:ko.observable(),
        subscribe: function () 
            var sub = app.on('sample:event').then(function(message) 
                this.received.push(message);
            , this);

            this.subscription(sub);
        ,
        unsubscribe: function () 
            this.subscription().off();
            this.subscription(null);
        
    ;
);

可以考虑的其他选项

一个共享模块，它返回一个具有应在父/子之间共享的属性的单例。缺点它需要定义为所有父/子中的依赖项。 一个全局的，例如带有属性的 myApp... 缺点：暴露全局

【讨论】：

这是一个非常酷的解决方案。 :) 再次感谢 Rainer 的所有帮助。