0

我正在使用 Knockout 并将可观察的集合绑定到标记。

如果我可以为集合中的每个项目添加一个计算函数，那就太好了，但我不确定如何在 Knockout 中正确执行此操作。

例如，给定这个模型：

var model = {
    'persons' : [
        { firstName: "John", lastName: "Smith" },
        { firstName: "Sgt.", lastName: "Shiney-Sides" },
        { firstName: "Rusty", lastName: "Schacklefurt" }
    ]
};

ko.applyBindings(model);

我想添加一个fullName连接名字和姓氏的计算函数。

4

2 回答 2

2

您可以使用Knockout Mapping 插件来实现这一点。

代码看起来像这样：

var model = {
    'persons' : [
        { firstName: "John", lastName: "Smith" },
        { firstName: "Sgt.", lastName: "Shiney-Sides" },
        { firstName: "Rusty", lastName: "Schacklefurt" }
    ]
};

// specifies the create callback for the 'persons' property
var mappingOptions = {
    'persons': {
        // overriding the default creation / initialization code
        create: function (options) {
            var Person = function () {
                this.fullName = ko.computed(function () {
                    return this.firstName() + ' ' + this.lastName();
                }, this);

                // let the ko mapping plugin continue to map out this object, so the rest of it will be observable
                ko.mapping.fromJS(options.data, {}, this);
            };
            return new Person();
        }
    }
};

model = ko.mapping.fromJS(model, mappingOptions);

ko.applyBindings(model);

此解决方案归功于Allen Rice。

于 2013-04-21T10:37:05.353 回答
1

@jonathanconway 的答案是正确的，但有点落后，而且它对大集合的内存使用量很大，将类的声明从 create 方法中移出。

然后只需从 create 函数中调用构造函数，例如

create: function (options) {
   return new Person(options);
}

为了节省更多内存，您可以将计算结果移至原型声明。

于 2013-04-22T08:11:50.797 回答