Question

我遇到了knockout.js和映射插件没有为源数据中的子数组创建模型的问题

var data = {
    outer: [
        {
        'id': 1,
        name: 'test outer',
        inner: [{
            'id': 1,
            name: 'test inner'}]}]
};

function OuterModel(data) {
    var self = this;
    ko.mapping.fromJS(data, {}, this);

    self.fullText = ko.computed(function() {
        return self.id() + ". " + self.name();
    });
}

function InnerModel(data, parent) {
    var self = this;
    ko.mapping.fromJS(data, {}, this);

    self.fullText = ko.computed(function() {
        return self.id() + ". " + self.name() + "(" + parent + ")";
    });
}

function PageModel() {
    var self = this;
    this.data = null;
}

var mapping = {
    'outer': {
        key: function(data) {
            return ko.utils.unwrapObservable(data.id);
        },
        create: function(options) {
            var thisModel = new OuterModel(options.data);
            return thisModel;
        }
    },
    'inner': {
        key: function(data) {
            return ko.utils.unwrapObservable(data.id);
        },
        create: function(options) {
            var thisModel = new InnerModel(options.data);
            return thisModel;
        }
    }
};

var model = new PageModel();
model.data = ko.mapping.fromJS(data, mapping);

（这是我可以为此做的一小部分回购。这里提供小提琴：http://jsfiddle.net/msieker/6Wx3s/）

简而言之，永远不会调用InnerModel构造函数。我已使用'InnerModel'和此'inner'映射中的var data = { outer: [ { 'id': 1, name: 'test outer', inner: [{ 'id': 1, name: 'test inner'}]}] }; var outerMapping = { 'outer': { key: function(data) { return ko.utils.unwrapObservable(data.id); }, create: function(options) { var thisModel = new OuterModel(options.data); return thisModel; } } }; function OuterModel(data) { var self = this; ko.mapping.fromJS(data, innerMapping, this); self.fullText = ko.computed(function() { return self.id() + ". " + self.name(); }); } var innerMapping = { 'inner': { key: function(data) { return ko.utils.unwrapObservable(data.id); }, create: function(options) { console.log(options); var thisModel = new InnerModel(options.data, options.parent()); return thisModel; } } }; function InnerModel(data, parent) { var self = this; ko.mapping.fromJS(data, {}, this); self.fullText = ko.computed(function() { return self.id() + ". " + self.name() + "(" + parent + ")"; }); } function PageModel() { var self = this; this.data = null; } var model = new PageModel(); model.data = ko.mapping.fromJS(data, outerMapping); ko.applyBindings(model);?进行了尝试。从我所看到的大多数情况来看，这应该可行，但显然我错过了一些东西。

任何人都有这方面的经验可以指出我正确的方向吗？

修改基于@John Earles的回答，我已经把它更接近我需要的东西了：

parent

然而，传递给InnerModel的null是options，这就是我追求映射插件的全部原因。文档让我相信这应该是create参数传递到observable函数，而是我得到null，其值为{{1}}。还有这方面的其他指示吗？

Answer 1

您没有将映射选项（定义如何映射内部）传递给OuterModel映射调用。

function OuterModel(data) {
    var self = this;
    ko.mapping.fromJS(data, mapping, this);

    self.fullText = ko.computed(function() {
        return self.id() + ". " + self.name();
    });
}

编辑：更新了小提示以显示父级的手动附件：

http://jsfiddle.net/jearles/6Wx3s/5/

Answer 2

我有一段非常类似的情况，请查看Q＆amp; A：Map JSON data to Knockout observableArray with specific view model type

在我的示例中，我有一个StateViewModel，其中包含一个用2个CityViewModel填充的observableArray，每个CityViewModel包含一个用2个StreetViewModel填充的observableArray。

然后我希望使用knockout的映射插件从我的层次结构json数据构建这个视图模型结构。

这个小提琴贴出了答案：http://jsfiddle.net/KodeKreachor/pTEbA/2/

Knockout.js映射不绑定子模型

2 个答案: