Question

我正在使用KnockoutJs成功管理标签SPA的观看次数。使用此处演示的技术（http://gistpages.com/2013/06/24/multiple_models_in_view_with_knockoutjs）我将选项卡功能拆分为它自己的文件中的自己的视图。

这些观点可以孤立地运作。我遇到的问题是当第二个applyBindings被调用时它会覆盖第一个。

ko.applyBindings(new FirstViewModel, document.getElementById('first-div'));
    ko.applyBindings(new SecondViewModel, document.getElementById('second-div'));

HTML：

   <div data-bind="stopBinding: true">
                <div id="first-div" hidden="hidden">
                    @Html.Partial("_FirstPartial")
                </div>
   </div>
   <div data-bind="stopBinding: true">
                <div id="second-div" hidden="hidden">
                    @Html.Partial("_SecondPartial")
                </div>
   </div>

如果在FirstViewModel中执行方法时我测试'this'对象是SecondViewModel，那么在FirstViewModel上引用observable时我会得到未定义的错误，因为上下文是错误的。

我想做不可能的事吗？（有几个网站建议这很容易做到。）

Answer 1

好的，我发现了问题。

简而言之，UL LI KnockoutJs点击数据绑定到菜单视图模型，例如LoadDevices（）等菜单视图模型的LoadDevices函数调用DevicesViewModel并运行其LoadDevices（）函数。当我在后一种方法中开始调试self的值时，我可以看到它是菜单视图模型，而不是我正在执行LoadDevices（）的设备视图模型。

经过一些进一步的试验和错误，我发现检查了这个＆＃39;的价值。显示了实际的设备视图模型对象。

这让我觉得我可能错误地定义了我的视图模型，然后我重新检查了var self = this;文档。在这里，我看到了他们分配这个例子的例子，例如

var

检查我的视图模型我正在完成作业，但我放弃了var，因此全局创建了自我。这似乎是我所有问题的根源。使用{{1}}定义自我修复了对象引用问题，其中＆＃39; self＆＃39;参考菜单视图模型。之前所有工作的原因是因为所有内容都包含在一个视图模型中，因此掩盖了“自我”的全球范围。拆分成多个视图模型暴露了我的错误。

在此之后，一切正常，我现在正在使用单独的视图模型来有效地为应用程序的每个选项卡/页面。

Answer 2

好像是一个错字， ko.applyBindings(new FirstViewModel) 应该 ko.applyBindings(new FirstViewModel())

如果不是这种情况，则错误是由您未提供的某些代码引起的，您提供的标记似乎没问题。 stopbinding表明在父元素上绑定了另一个viewmodel。这里发生了什么事？或者也许stopBinding不起作用。

您可以尝试在控制台中执行ko.dataFor(document.getElementById('second-div'))或ko.dataFor(document.getElementById('first-div'))（例如chrome console f12 + esc），或尝试使用document.getElementById（＆＃39; second-div＆＃39;）检查是否有2个元素带有id＆＃39; second-div＆＃39;在页面上。

KnockoutJs视图上下文似乎绑定到最后分配的视图模型

2 个答案: