代码之家  ›  专栏  ›  技术社区  ›  Alvaro

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

  •  0
  • Alvaro  · 技术社区  · 10 年前

    淘汰。js文档介绍 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);
    

    我该怎么做?

    1 回复  |  直到 10 年前
        1
  •  2
  •   CrimsonChris    10 年前

    你应该做一个 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);
        });
    }
    

    如果出于某种原因,您希望避免创建 使用者 类,则需要转换 名称 属性转换为可观察的其他方式。就像这样。。。

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