Question

我有一个可观察的对象，需要在保存到服务器后进行更新。当我重新加载observable时，它会导致validatedObservable停止工作。如何在更新它引用的observable后保持validatedObservable正常工作？

在我的测试示例中，如果最初单击“保存”按钮，则会在文本框旁边显示错误，并在下面显示摘要错误消息。

填写文本框，然后单击“保存”。摘要错误消息的绑定不再有效。

http://jsfiddle.net/abJHj/

<div data-bind="with: person">
    Id <span data-bind="text: id">0</span><br />
    Name <input data-bind="value: name, valueUpdate: 'input'" value="." placeholder="new person name" /><br/>
    Modified Date <span data-bind="text: modifiedDate">0</span><br/>    
</div>
<p><span data-bind="visible: allErrors().isAnyMessageShown()">We have errors!</span></p>
<button data-bind="click: saveAndReloadPerson">Save And Reload Person</button>
<p data-bind="text: ko.toJSON($root)"></p>


ko.validation.init({
    grouping: { deep: true, observable: true, live: true }
});

function Person(person) {
    var self = this;
    person = person || {};

    self.id = ko.observable(person.id);
    self.name = ko.observable(person.name).extend({ required: { params: true, message: "Name required" }});
    self.modifiedDate = ko.observable(person.modifiedDate);
}

function VM(data) {
    var self = this;
    data = data || {};

    self.person = ko.observable(new Person(data));

    self.allErrors = ko.validatedObservable({
        person: self.person
    });

    self.saveAndReloadPerson = function () {
        debugger;
        if(self.allErrors.isValid()){
            self.person(new Person({ id: 1, name: "Tom", modifiedDate: new Date() }));
        }
        else{
            self.allErrors().errors.showAllMessages()
        }
    };

}

var vm = new VM({ id: 0, name: "" });
ko.applyBindingsWithValidation(vm);

Answer 1

您可以更新单个属性，而不是使用self.person对new Person可观察对象进行重新补充。

当然，如果您的应用程序有更多内容可能还有其他影响，那么此处显示，但对于您在问题中显示的内容，这似乎是完全合理的。

更新：你也可以像这样对每个人进行验证：

function Person(person) {
    var self = this;

    // ...

    self.allErrors = ko.validatedObservable(self);
}

并根据当前人物计算VM计算allErrors。注意：您可能需要检查空值。

function VM(data) {
    var self = this;

    // ...

    self.allErrors = ko.computed(function() {
        return self.person().allErrors();
    });

    // ...
}

更新后绑定在validatedObservable上丢失

1 个答案: