剔除foreach绑定，更新值

Question

我有ko模型：

var Model = function(notes) {
    this.note = ko.observableArray(notes);
}; 

var model = new Model([{"post":"a"},{"post":"b"}]);
ko.applyBindings(model);

和html div：

<div data-bind='foreach: note'>
    <p><span data-bind='text: post'>
    <p><input data-bind='value: post'>
</div>

小提琴在这里： http : //jsfiddle.net/DE9bE/

我想在输入中输入新文本时更改跨度值，例如在小提琴中输入 ： http : //jsfiddle.net/paulprogrammer/vwhqU/2/但它没有更新。 我如何在foreach绑定中做到这一点？

Answer 1

对象的属性需要制成可观察的 。

您可以自己手动执行此操作（我在这里使用了普通的js数组map方法，如果需要IE8支持，则可以出于相同目的使用ko.utils.arrayMap ）：

var Model = function(notes) {
    this.note = ko.observableArray(notes.map(function(note){
        note.post = ko.observable(note.post);
        return note;
    }));
}; 
var model = new Model([{"post":"a"},{"post":"b"}]);
ko.applyBindings(model);

演示

---

或者，您可以使用映射插件 （需要包括单独的js文件）为您执行此操作（递归）。

var Model = function(notes) {
    this.note = ko.mapping.fromJS(notes);
}; 
var model = new Model([{"post":"a"},{"post":"b"}]);
ko.applyBindings(model);

演示

---

如果您从服务器获取整个数据对象，则也可以直接将其输入：

var model = ko.mapping.fromJS({
    note: [{"post":"a"},{"post":"b"}]
});
ko.applyBindings(model);

演示

Answer 2

尝试这个：

HTML

<div data-bind='foreach: note'>
    <p><span data-bind='text: post'></span></p>
    <p><input data-bind='value: post'/></p>
</div>

JavaScript的

 var Model = function (notes) {
      this.note = ko.observableArray(notes);
 };
 var Post = function (data) {
     this.post = ko.observable(data);
 };

 var model = new Model([new Post("a"), new Post("a")]);
 ko.applyBindings(model);

演示

Answer 3

您想要的是带有可观察变量的可观察数组，否则您将不会更新跨度，因为您正在更改不可观察变量，请参阅此文章。

KnockoutJS-可观察对象的可观察数组