嵌套视图模型的淘汰赛验证答案

【问题标题】：Knockout Validation on Nested View Model嵌套视图模型的淘汰赛验证
【发布时间】：2015-08-17 17:34:30
【问题描述】：

我希望结合使用 KnockoutJS 库、Knockout.Mapping 插件和 Knockout-Validation 插件来显示一些用户可以操作的数据。

我的数据作为 AJAX 调用的嵌套对象传入，我通过映射插件运行该数据以创建 Knockout 视图模型，并使用 ko.mapping.fromJS 中的映射选项对象自定义验证规则。

如果字段为空，我已成功获取第一层的对象（下面小提琴中的名称）以显示消息，但是嵌套的对象 (IntroData.PlanName) 不显示验证消息。我需要为这些嵌套对象设置不同的映射对象吗？

ViewModel（我的 AJAX 调用中的示例）：

var stuff = {
    IntroData: {
        PlanName: 'Test'
    },
    name: 'tes2s3t'
};

映射：

var validationMapping = {
    IntroData: {
        PlanName: {
            create: function (options) {
                return ko.observable(options.data).extend({
                    required: true
                });
            }
        }
    },
    name: {
        create: function (options) {
            return ko.observable(options.data).extend({
                required: true
            });
        }
    }
};

联播：

ko.validation.init({
    registerExtenders: true,
    messagesOnModified: true,
    insertMessages: true,
    parseInputAttributes: true,
    messageTemplate: null,
    grouping: {
        deep: true
    }
}, true);

window.viewModel = ko.validatedObservable(ko.mapping.fromJS(stuff, validationMapping));

ko.applyBindings(window.viewModel);

小提琴：http://jsfiddle.net/odxv53g9/5/

谢谢！

【问题讨论】：

标签： javascript validation knockout.js knockout-mapping-plugin knockout-validation

【解决方案1】：

文档对此并不清楚，但显然ko.mapping.fromJS() 忽略了嵌套映射，因此永远不会调用 PlanName 的“create”方法。

您可以改为为 IntroData 添加显式映射：

IntroData: {
    create: function (options) {
        var nestedMapping = {
            PlanName: {
                create: function (options) {
                    return ko.observable(options.data).extend({
                        required: true
                    });
                }
            }
        }

        return ko.mapping.fromJS(options.data, nestedMapping);
    }        
}

这是一个有效的小提琴：http://jsfiddle.net/odxv53g9/6/

【讨论】：