Question

我在＆＃34;你好世界＆＃34;与knockout.js和数据绑定的阶段。

我无法找到绑定和更新存储在observableArray中的对象的成员值的正确方法。

绑定首次使用，但之后它不会在网页中自行更新。

这是我想要做的事情：

<div class="row" data-bind="foreach:chains">
    <div class="col-md-12">
        <h3>Obj id is <span data-bind="text: id"></span> </h3>
        <span data-bind="text: message"></span>         
        </div>
    </div>

javascript部分：

(function () {
  var Chain = function (chainId) {
    var self = this;
    self.id = chainId;
    self.message = "N/A";
    // etc. (more memberS)
};


var Model = function() {
    var self = this;
    self.chains = ko.observableArray();
};

 Model.prototype = {
    updateChains: function(updatedChains) {
         // here chain values are updated, in words:
         // if chain does not exist then create it and add it to self.chains
         // self.chains.push(newChain); 
         // otherwise update chain.message as:
         // existingChain.message = updatedMessage;
   }

var model = new Model();

$(function() {
    ko.applyBindings(model);
});
}());

我调试了代码，在更新部分一切正常，message获得了一个新值，但它在UI中不可见（它仍然是＆＃34; N / A＆＃34 ）。我似乎在绑定中做错了什么。

我尝试了其他几种方法，但每次都失败了。

我怎样才能做到这一点？

Answer 1

来自Observable Arrays上的Knockout页面：

关键点：observableArray跟踪在数组中的哪些对象，不这些对象的状态

简单地将对象放入observableArray并不会使该对象的所有属性本身都可观察到。当然，如果您愿意，您可以观察这些属性，但这是一个独立的选择。 observableArray只跟踪它所拥有的对象，并在添加或删除对象时通知侦听器。

如果您希望message上的Chain可以观察到：

var Chain = function (chainId) {
    var self = this;
    self.id = chainId;
    self.message = ko.observable("N/A");
    ...
};

然后，当您想在现有message上设置Chain时，您需要执行此操作：

existingChain.message(updatedMessage);

不这个：

existingChain.message = updatedMessage

Answer 2

仅当数组本身被修改时，可观察数组才会跟踪其内容的状态。

Documentation (second paragraph)

实现目标的一种方法是让您的Chain类的成员也可以观察到：

var Chain = function (chainId) {
    var self = this;
    self.id = chainId;
    self.message = ko.observable("N/A");
    // etc. (more members)
};

您的更新功能将在找到的对象中设置observable：

self.chains（）[foundIndex] .memberToUpdate（newValue）以

Knockout绑定：如何更新observableArray（）中存储的对象的值？

2 个答案: