在 knockout.js 中的数组内创建可观察对象属性

Question

Knockout.js 文档说 observableArray

仅仅将一个对象放入 observableArray 并不能使该对象的所有属性本身都可观察。当然，如果您愿意，您可以使这些属性可观察，但这是一个独立的选择。

但它没有指定如何使属性可观察。

我有一个 users 数组，我想让属性 name 可观察，以便能够在某些操作下从另一个视图模型更改它。

这是我尝试过但没有成功的方法：

Reproduction online

var shouter = new ko.subscribable();

function usersViewModel() {
    var myData = [array of objects];
    var self = this;
    self.selectedRow = ko.observable();
    self.items = ko.observableArray(myData);

    self.selectedRow.subscribe(function (newValue) {
        console.log(newValue);
        shouter.notifySubscribers(newValue, "selectedRow");
    });

}

function departmentViewModel() {
    var self = this;
    self.row = ko.observable();

    //getting info from another view model
    shouter.subscribe(function (user) {
        self.row(user);
        console.log(self.row());

        self.row().name = ko.observable('Testing!!!');
    }, this, "selectedRow");

}

var MasterViewModel = function () {
    this.users = new usersViewModel();
    this.department = new departmentViewModel();
}

var mm = new MasterViewModel();
ko.applyBindings(mm);

我该怎么做？

Answer 1

您应该创建一个 User 类，将 name 作为可观察属性。

function User(userData) {
    userData = userData || {};
    this.id = userData.id;
    this.name = ko.observable(userData.name);
    this.status = userData.status;
}

function UsersViewModel() {    
    var myData = [{
        id: "001",
        name: "Jhon",
        status: "Single"
    }, {
        id: "002",
        name: "Mike",
        status: "Married"
    }, {
        id: "003",
        name: "Marrie",
        status: "Complicated"
    }];

    self.users = ko.observableArray(myData.map(function(userData) {
        return new User(userData);
    });
}

如果出于某种原因您想避免创建User 类，那么您需要以其他方式将name 属性转换为可观察对象。就这样……

myData.forEach(function (data) {
    data.name = ko.observable(data.name);
});
self.users = ko.observableArray(myData);