Question

我想从另一个更新一个viewModel的一个observable。值已更改，但不会反映在UI上（在HTML中）

我不确定代码有什么问题..

以下是代码：

<p data-bind="text: name"></p>

没有得到更新。

Answer 1

您绑定了两个独立视图模型实例

ko.applyBindings(new viewModel1(), document.getElementById("firstViewModel"));
ko.applyBindings(new viewModel2(), document.getElementById("secondViewModel"));

因此，您viewModel1和viewModel2之间以及当您在viewModel1中写信时之间没有关联：

var vm2Object = new viewModel2();

然后您将创建一个完整的新viewModel2实例，该实例与applyBindings中使用的实例无关。

要解决此问题，您需要在视图模型之间建立连接，不管怎样这样（使用容器视图模型还有其他多种方法，将视图模型嵌套到彼此等等）：

var viewModel1 = function(vm2){
   var self = this;
   var vm2Object = vm2; //use vm from parameter
   //...
}

调用applyBindings：

时

var vm2 = new viewModel2();
ko.applyBindings(new viewModel1(vm2), document.getElementById("firstViewModel"));
ko.applyBindings(vm2, document.getElementById("secondViewModel"));

演示JSFiddle。

Answer 2

您有两个不同的VM2 ViewModel实例。而是做

http://jsfiddle.net/RSL4u/4/

我已将VM2作为VM1的子模型

this.vm2Object = new viewModel2();

Answer 3

我尝试了所有方法，出于某种原因，他们并没有真正使用我的解决方案。

经过大量的Google搜索并深入挖掘KnockoutJS文档和扩展程序后，我找到了 Knockout Postbox ，它允许我们在多个不相关的View模型之间进行同步或通信。

https://github.com/rniemeyer/knockout-postbox

以下是我演示示例的片段...

var viewModel1 = function(){
   var _self = this;
   _self.name = ko.observable("Rahul").syncWith("syncedName");
}

var viewModel2 = function(){
   var _self = this;
   _self.firstName = ko.observable("Rahul").syncWith("syncedName");

}

ko.applyBindings(new viewModel1(), document.getElementById("div1"));
ko.applyBindings(new viewModel1(), document.getElementById("div2"));

现在两个observable都在同步..我发现这比嵌套对象要好得多..至少它满足了我的应用程序的需要..

非常感谢你的帮助..

我的演示：JSFiddle：http://jsfiddle.net/rahulrulez/2kuSh/1/

我希望它有所帮助......

非常感谢你，

Rahul Patil。

无法更新另一个viewModel的可观察对象

3 个答案: