淘汰验证内部可观察验证未触发

Question

我有以下JS 对象：

var form= function () {

    var self = this;

    self.Name = ko.observable().extend({
        required: {
            message: 'Name is required.'
        }
    });
    self.Manager = ko.observable().extend({
        required: {
            message: 'Manager is required.'
        }
    });
    self.Email = ko.observable().extend({
        required: {
            message: 'Email is required.'
        },
        email: {
            message: 'Entered Email is not valid.'
        }
    });

    self.Players = ko.observableArray([]);

}

上述JS 对象中的Players 数组使用以下JS 对象使用new Player() 语法填充：

 var Player = function () {

        var self = this;

        self.FirstName= ko.observable().extend({
            required: {
                message: 'Player First Nameis required.'
            }
        });

        self.LastName= ko.observable().extend({
            required: {
                message: 'Player Last Name is required.'
            }
        });
    }

我对@9​​87654330@ 库使用了以下设置：

ko.validation.init({
    registerExtenders: true,
    messagesOnModified: true,
    insertMessages: false,
    parseInputAttributes: true,
    messageTemplate: null,
    decorateInputElement: true,
    errorElementClass: 'error',
    grouping: {
        deep: true,
        observable: true
    }
}, true);

我正在使用viewModel.errors.showAllMessages() 在视图模型中显示所有错误消息。我面临的问题是player 对象的验证没有被触发，因为它存在于Form 对象中。我什至将deep 属性设置为true，但即使这样也不起作用，可能是什么问题？

Answer 1

简短的回答是您需要使用 { live: true } 来跟踪添加到可观察数组的对象的错误。

更长的答案：

我以 Jeroen 的小提琴作为起点，并假设您想要显示所有玩家的所有可验证 observable 的错误消息。

使用 ko.validation.group(vm, options) 获取错误列表。暴露 showAllMessages 函数的是返回的对象（一个计算的 observable 返回一个错误数组）。

默认情况下，它不会对提供的视图模型执行深度遍历，因此您只会收到 Name、Manager 和 Email 属性的错误（我假设您当前会遇到）。

要使其使用深度遍历，您可以提供 { deep: true } 选项。这应该会为调用 group 函数时数组中的所有玩家提供错误。

如果您希望它在调用 group 函数后也跟踪添加到可观察数组（在您的情况下为玩家）的对象，您可以使用 { live: true } 选项。它将在数组上创建一个订阅，并在每次修改数组时更新错误列表。这是添加它的问题：https://github.com/Knockout-Contrib/Knockout-Validation/pull/223

下面是相关的片段，这里是小提琴： https://jsfiddle.net/2a7t72be/1/

var form = function () {
    var self = this;

    self.showErrors = function(){
        self.errors.showAllMessages();
    };

    // ...

    self.Players = ko.observableArray([]);

    self.errors =   ko.validation.group(self, { deep: true, live: true });
}

附言。您当然可以在调用 validation.init 时配置分组选项（只需在调用 group 之前进行）。