0

谁能解释为什么这不起作用?

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>
4

2 回答 2

2

您应该打开包装observableArray以访问该数组。此外,年龄属性是不可观察的,因此您不能以这种方式为其赋值。您应该将其转换为 observable 或使用=.

useForEach = function () {
    ko.utils.arrayForEach(persons(), function (item) {
        item.age = 99;
    });
};

我建议为“人”添加一个单独的类,其中所有属性都是可观察的:

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/

于 2013-11-01T08:45:41.660 回答
1

这里的主要区别在于,在这种情况下,我们正在制作一个observableArrayofko.observables并且在您制作的问题中只是一个observableArray. Knockout 文档也强调了这一点。

关键点:一个 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/

于 2013-11-01T09:31:17.843 回答