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/

我想在输入中输入新文字时更改 span 值，就像在小提琴中一样：http://jsfiddle.net/paulprogrammer/vwhqU/2/ 但它没有更新。我怎样才能在foreach绑定中做到这一点？

Answer 1

需要将对象的属性设置为observables。

你可以自己手动完成这个（我在这里使用了普通的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);

Demo

或者您可以使用mapping plugin（您需要包含的单独的js文件）为您执行此操作（递归）。

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

Demo

如果您从服务器获取整个数据对象，您也可以直接提供它：

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

Demo

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);

<强> Demo

Answer 3

你想要的是一个带有observable的可观察数组，否则你的span将不会更新，因为你正在更改一个不可观察的变量，请参阅这篇文章。

KnockoutJS - Observable Array of Observable objects

淘汰foreach绑定，更新值

3 个答案:

HTML

的JavaScript