validation - knockout 验证可以扩展 validateObservable 来验证整个模型吗?

标签 validation mvvm knockout.js knockout-validation

我正在将 Knockout 用于绑定(bind)到具有一定深度/复杂性的 ViewModel 的 View 。

为了验证我的 ViewModel,我需要计算整个 VM 树(遍历并比较后代)。我希望利用 knockout 验证插件@https://github.com/ericmbarnard/Knockout-Validation创建一些任意的自定义验证规则并报告任何错误。

我使用 KO 计算的可观察值设置了一种可能的方法 @ http://jsfiddle.net/drdamour/ZrVZ7/ 。验证规则是确保没有 2 个子集合具有相同的值。这是有效的,但它没有使用 Knockout-Validation,并且我的规则现在在我的计算可观察值中实现,这似乎是错误的。

我的问题与 Knockout Validation validatedObservable group error 非常相似但我发现发现的解决方案(托管于 http://jsfiddle.net/CGuW2/6/ )不太理想:

var viewModel = {
    num1: ko.observable("50").extend({ number: true, min: 0, max: 100 }),
    num2: ko.observable("50").extend({ number: true, min: 0, max: 100 })
};

viewModel.isValidSum = ko.validatedObservable({
                            num1: viewModel.num1,
                            num2: viewModel.num2
                        }).extend({ mustEqual: 100 });

ko.applyBindings(viewModel);

因为它通过将经过验证的自身作为属性添加到自身(isValidSum)来复制 ViewModel。我试图消除这种冗余@ http://jsfiddle.net/drdamour/5B8s4/但 View 无法绑定(bind)到 validObservable:

var viewModel = {
    num1: ko.observable("50").extend({ number: true, min: 0, max: 100 }),
    num2: ko.observable("50").extend({ number: true, min: 0, max: 100 })
};

var vm = ko.validatedObservable(viewModel).extend({ mustEqual: 101 });

ko.applyBindings(vm);

这可能是 KO 或 KO 验证的错误,或者我可能完全错了。

所以问题是:在 knockout 中确定虚拟机对于跨虚拟机的多个属性和层进行评估的条件是否有效的最佳方法是什么?

最佳答案

我通过采用不同的方法来验证我的模型,通过对我想要在模型上验证的可观察值进行分组来避免这种循环:

这是一些用于设置我的阶段的初始化代码(您可以查看所有可用的选项Here:

    ko.validation.init({
        registerExtenders: true,
        parseInputAttributes: true,
        grouping: { deep: true, observable: false }
    });

然后我会像这样设置你的模型:

function testModel() {
    var self = this;
    self.num1 = ko.observable(100).extend({ number: true, min: 0, max: 100 });
    self.num2 = ko.observable(50).extend({ number: true, min: 0, max: 100 });

    self.sum = ko.observable(150).extend({ number: true, equal: 100 });
    self.num1.subscribe(function () {
        self.sum(self.num1() + self.num2());
    });
    self.num2.subscribe(function () {
        self.sum(self.num1() + self.num2());
    });

    self.errors = ko.validation.group(this);
}

var viewModel = new ViewModel();

//somewhere later where we are testing the model
if (viewModel.sum.isValid())
    //YAY!!!
else
   //this will update the UI as you have configured it to show the error messages
   viewModel.errors.showAllMessages(); 

使用ko.validation.group(model)将导致验证遍历模型中的所有可观察量(多深,取决于初始设置,你会注意到我做了我的grouping: { deep: true } 这意味着如果该模型中有带有可观察值的子模型,它也会验证这些子模型。

如果您想隔离不同的验证案例,您不仅可以对整个模型执行此操作,还可以对其中的部分模型执行此操作。

编辑:

这里有一种有效的方法可以满足您的要求。必须订阅您想要根据条件进行验证的所有可观察量并不理想,但唯一的选择是将它们简单地分组到一个 validObservable 中,这意味着最有可能是您的数据的首选结构。

关于validation - knockout 验证可以扩展 validateObservable 来验证整个模型吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14149327/

相关文章:

javascript - 表单提交knout js时checkbox表单字段名未提交

python - 如何更改 Django 中 MinValueValidator 错误消息中的日期格式?

validation - 使用 JSR 303 时,每个字段仅显示一条错误消息

javascript - checkValidity 和 validity 之间的区别

c# - WPF:如何在 MVVM 中播放 Storyboard?

c# - 绑定(bind) OxyPlot Tracker 并在 TextBlock 中设置获取值

javascript - knockout 计算不会自动更新

javascript - 客户端表单验证。

c# - 具有不同命名空间的 Caliburn Micro ViewLocator

javascript - 使用 webpack 时自定义处理程序不起作用