有谁可以解释为什么这不起作用?
function MyViewModel() {
var data = [
{ forename: "Bob", age: 23 },
{ forename: "Alex", age: 19 },
{ forename: "Joe", age: 67 }
];
var persons = ko.observableArray(data);
useForEach = function () {
ko.utils.arrayForEach(persons, function (item) {
item.age(99);
});
};
return {
persons: persons,
useForEach: useForEach
}
}
var vm = new MyViewModel();
ko.applyBindings(vm);
我希望年龄在我看来更新但没有任何反应......这是我的观点:
<button data-bind="click: useForEach ">useForEach</button>
<table>
<thead>
<tr>
<th>Forename</th>
<th>Age</th>
</tr>
</thead>
<tbody data-bind="foreach: persons">
<tr>
<td data-bind="text: forename"></td>
<td data-bind="text: age"></td>
</tr>
</tbody>
</table>
答案 0 :(得分:2)
您应该解包observableArray
以访问阵列。此外,年龄属性不可观察,因此您无法以这种方式为其赋值。您应该将其转换为可观察对象,或使用=
分配值。
useForEach = function () {
ko.utils.arrayForEach(persons(), function (item) {
item.age = 99;
});
};
我建议为&#39; person&#39;添加一个单独的课程。所有属性都是可观察的:
function Person(name, age){
var self = this;
self.forename = ko.observable(name);
self.age = ko.observable(age);
}
function MyViewModel() {
var data = [new Person("Bob", 23), new Person("Alex", 19), new Person("Joe", 67)];
var persons = ko.observableArray(data);
useForEach = function () {
ko.utils.arrayForEach(persons(), function (item) {
item.age(99);
});
};
return {
persons: persons,
useForEach: useForEach
}
}
这是工作小提琴:http://jsfiddle.net/Hn5we/1/
答案 1 :(得分:1)
这里的主要区别在于,在这种情况下,我们正在制作observableArray
ko.observables
,而问题只是observableArray
。淘汰文档也强调了这一点。
关键点:observableArray跟踪数组中的对象, 而不是那些对象的状态
简单地将一个对象放入一个observableArray并不能完全实现 该对象的属性本身是可观察的。当然可以 如果你愿意,可以观察这些属性,但那是一个 独立选择。 observableArray只跟踪它的对象 保持,并在添加或删除对象时通知侦听器。
试试这个
function Person(fn, age){
var self = this;
self.forename = ko.observable(fn);
self.age = ko.observable(age);
}
var data = [
{ forename: "Bob", age: 23 },
{ forename: "Alex", age: 19 },
{ forename: "Joe", age: 67 }
];
function MyViewModel() {
var self = this;
var personArray = [];
for(var i=0;i<data.length; i++){
personArray.push( new Person(data[i].forename, data[i].age));
}
self.persons = ko.observableArray(personArray);
self.useForEach = function () {
ko.utils.arrayForEach(self.persons(), function (item) {
item.age(99);
});
};
}