Question

我遇到了Knockout ObservableArray问题，该问题由具有可观察属性的对象组成。我的视图模型相当复杂，但我在下面创建了一个简单的测试来说明问题。

我的问题是，当我在ObservableArray中的一个对象中更改observable属性的值时，为数组中的 ALL 对象更改了值。

我有一个部门viewModel，该部门有一组可观察的员工。然后，我创建了5个对象personVM实例，这些实例被推送到员工ObservableArray上。 personVM的每个实例都获得唯一的firstName。

以下是加载它们的模型和代码。

var theDepartmentVM = {
        employees: ko.observableArray(), 
        departmentName: ko.observable()
};

var personVM= {
    firstName: ko.observable()
    }

$(document).ready(function (){
    departmentVM.departmentName = "SomeDepartment";
    for (i=1; i<=5; i++){
        var person = Object.create(personVM);
        personVM.firstName("EMP - " + i.toString());
        departmentVM.employees.push(personVM);
    }
    ko.applyBindings(departmentVM);
});

这增加了五个名称（EMP-1，EMPT-2等）。然后我用以下标记显示名称：

<div data-bind="foreach: employees">
   <label data-bind="text: firstName"></label>
</div>

我的输出名称为“EMP-5”五次。它始终是我添加到数组中的最后一个值。

我认为问题是我有五个personVM实例，但每个实例中的firstName对象指向同一个observable。这是对的吗？

我需要做些什么才能获得理想的结果？

Answer 1

试试这个

http://jsfiddle.net/r9sqjojL/2/

<div data-bind="foreach: employees">
   <label data-bind="text: firstName"></label>
</div>
var departmentVM = {
        employees: ko.observableArray(), 
        departmentName: ko.observable()
};

var personVM = function() {
        this.firstName = ko.observable();
}
departmentVM.departmentName = "SomeDepartment";
for (i=1; i<=5; i++){
        var person = new personVM();
        person.firstName("EMP - " + i.toString());
        departmentVM.employees.push( person );
}
ko.applyBindings(departmentVM);

淘汰可观察的观察阵

1 个答案: