Knockout.Validation 未显示初始渲染后加载的属性的错误消息

Joh*_*hnG 5 validation knockout.js

我有一个 Knockout.Validation 场景,我认为这很常见,但还没有通过在网络上搜索和本网站上的各种答案找到解决方案。

直到 ajax 调用之后,我正在验证的属性才会被添加到淘汰赛 observable 中。当验证被触发时,验证失败并且是我的验证组中的错误,但页面上没有显示错误消息。我已经通过将验证添加到初始渲染发生时确实存在的属性并为此显示消息来确保所有验证都已连接。

我知道我可以为该属性设置默认值,但我不希望您必须这样做。当我使用validationMessage数据绑定属性手动添加验证消息时,它会抛出一个js错误,因为当淘汰赛第一次通过时该属性不存在......未捕获的类型错误:无法处理绑定“validationMessage:函数(){ return BlogPost().Title }" 消息:无法读取未定义的属性“扩展”。

请参阅此 plunk 示例... http://plnkr.co/edit/OhUw8wP2uNypulbcOIbz?p=preview

    self.Errors = ko.validation.group(this, { deep: true });
    self.Count(self.Errors().length);
    if (self.Errors().length === 0) {
        alert("no errors");
    }
    else {
        self.Errors.showAllMessages();
    }
Run Code Online (Sandbox Code Playgroud)

它正在使用 require js 但这不会导致任何问题,因为验证消息显示的标准场景。

我在这里缺少什么才能使其正常工作?

Bre*_*een 2

这非常干净...将您的可观察量移动到主视图模型,并将 updateBlogPost 只是一个方法(没有属性...应该如此)。

这允许您在加载博客文章后调用 self.Errors.showAllMessages() 。不确定您是否需要此更改后的更新方法?

function EditBlogPostViewModel(params) {

    var self = this;
    self.BlogPost = ko.observable({});
    self.ErrorsCount = ko.observable(0);

    self.Test = ko.observable("").extend({ required: true });
    self.Count = ko.observable(0);
    self.Errors = ko.validation.group(this, { deep: true });
    self.Count(self.Errors().length);

    blogApiService.getCategories().then(function (categories) {
         return blogApiService.getBlogPost(params.id).then(function (post) {
             self.BlogPost(new BlogPost(post, categories));
             self.Errors.showAllMessages();
        });
    });

}

EditBlogPostViewModel.prototype.updateBlogPost = function () {
    var self = this;
    if (self.Errors().length === 0) {
        alert("no errors");
    }
    else {
        self.Errors.showAllMessages();
    }
};
Run Code Online (Sandbox Code Playgroud)