多个淘汰赛绑定并共享它们答案

【问题标题】：multiple knockout bindings and sharing them多个淘汰赛绑定并共享它们
【发布时间】：2013-01-30 14:25:18
【问题描述】：

所以我有一个场景，我的主页上有淘汰赛绑定。

Index.cshtml：

<div data-bind="foreach breadcrumbs">
<div>

<script>
 var IndexViewModel = function () {
    var self = this;
    self.breadcrumbs = ko.observableArray();
 };
 ko.applyBindings(IndexViewModel);
</script>

还有一个在 Index.cshtml 中加载的局部视图。部分视图有自己的淘汰赛绑定：

<div id="someId">

</div>
<script>
  var PartialViewModel = function () {
        var self = this;
        self.someFunction = function(){
            // Access Breadcrumbs here
        };
  };
  ko.applyBindings(PartialViewModel, "someId");
</script>

我想从第二个局部视图访问面包屑 observableArray 并向其中添加项目。我什至不确定这是否可能。请帮忙。我也在使用 sammy.js，但出于此目的，它并不那么相关。

【问题讨论】：

您的脚本将无法运行。您需要使用 new 调用 ViewModel 构造函数。

标签： asp.net-mvc-3 knockout.js sammy.js

【解决方案1】：

我不喜欢视图模型之间必须有依赖关系，所以我之前使用了一个 jQuery pubsub 插件来允许视图模型以解耦的方式相互通信。你可以在this answer看到它的一个例子

基本上，当您更新面包屑时，使用新数组调用发布，其他视图模型将订阅该事件。

【讨论】：

如果您在虚拟机之间以 KO 方式进行 pubsub，那么您可能需要查看我在此处创建的邮箱插件：github.com/rniemeyer/knockout-postbox。它有一些可观察的扩展，可以很容易地通过中介自动发布/订阅可观察的变化。
好点。我最初做这个的时候确实看过它，但是对于那个项目，我需要对每个事件做更多的事情，因此选择了 pubsub。您的插件非常适合这种情况，您是对的。 :)
淘汰赛邮箱是否与淘汰赛 2.2.0 兼容？我已经在我的源代码中包含了该库，但继续收到 Uncaught TypeError: Cannot call method 'subscribe' of undefined @RPNiemeyer
邮箱与 2.2 兼容。听起来你可能有其他事情发生。如果你有 repro，请随时在 knockmeout.net 上给我发送电子邮件 ryan
@RPNiemeyer 我想通了。 PEBCAK。谢谢。

【解决方案2】：

一个简单的解决方案（但不是很干净）是将 indexViewModel 存储在一个全局变量中。

Index.cshtml：

 var IndexViewModel = function () {
    var self = this;
    self.breadcrumbs = ko.observableArray();
 };
 // we create a global variable here
 window.indexViewModel = new IndexViewModel();

 ko.applyBindings(window.indexViewModel);

然后你可以从你的局部视图模型中访问这个 indexViewModel：

  var PartialViewModel = function () {
        var self = this;
        self.someFunction = function(){
            // Access Breadcrumbs here
            // better use some wrapping functions 
            // instead of accessing the array directly
            window.indexViewModel.breadcrumbs.push({}); 
        };
  };
  ko.applyBindings(new PartialViewModel(), "someId");
</script>

【讨论】：