knockout.utils.arrayForEach不工作?

时间:2013-11-01 08:39:21

标签: knockout.js

有谁可以解释为什么这不起作用?

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>

2 个答案:

答案 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);
        });
    };
}

小提琴:http://jsfiddle.net/codovations/wqmff/