如何使用挖空验证

how to use knockout validation

本文关键字：验证 何使用      更新时间：2023-09-26

我正在点击此链接来创建验证。

但是我不明白如何在代码中使用此扩展方法。

我使用来自调用 breeze 查询的记录将数据加载到我的可观察对象中。

我以以下方式加载数据

dataObsArray= ko.observableArray()
datacontext.getData(id,dataObsArray)
                   .then(function () {
          // some logic

 })
        .fail("Data not found");

然后我把这个obs数组绑定到我的视图，如下所示

<tbody data-bind="with: dataObsArraay">
            <tr>
                <td>name</td>
                <td> <input data-bind="  value: Name" ></td>
                <td> <input data-bind="  value: Age" ></td>
            </tr>
</tbody>

所以我不明白如何使用扩展方法，因为我只是将我的视图与可观察数组中的属性绑定在一起。

请指导我。

请考虑使用 breeze 验证，而不是通过挖空扩展器将验证逻辑放入 UI 代码中。 使用 breeze 验证将确保始终评估规则，并使您免于出于验证目的在实体上创建额外的模型。

下面是一个使用 Breeze 内置验证器之一的示例：stringLength 验证器。

var entityType = entityManager.metadataStore.getEntityType('????'),
    nameProperty = entityType.getProperty('Name'),
    nameLengthValidator = breeze.Validator.stringLength({ maxLength: 10, minLength: 2 });
nameProperty.validators.push(nameLengthValidator);

下面是不允许仅空格值的字符串的自定义必需验证程序的示例：

// make a reusable validator
var myRequiredValidator = breeze.Validator.makeRegExpValidator(
    "myRequiredValidator",  
    /'S/,  
    "The %displayName% '%value%' cannot be blank or entirely whitespace");
// register it with the breeze Validator class.
breeze.Validator.register(myRequiredValidator);
// add the validator to the Name property...
var entityType = entityManager.metadataStore.getEntityType('????'),
    nameProperty = entityType.getProperty('Name');
nameProperty.validators.push(nameLengthValidator);

这是制作正则表达式验证器的文档。

您还可以编写自定义验证器 - 查看 breeze 文档以获取更多信息 - 查找编写自定义验证器部分。

您需要

为数据创建一个模型，例如：

function person(name, age) {
    this.name = ko.observable(name).extend({ minLength: 2, maxLength: 10 });
    this.age = ko.observable(age).extend({ min: 18, max: 99 });
}
var data = [],
    people = ko.observableArray();
datacontext.getData(id, data)
    .then(function (data) {
        for (i = 0; i < data.length; i++) {
            people.push(new person(data.Name, data.Age));
        }
    })
    .fail("Data not found");

<tbody data-bind="foreach: people">
    <tr>
        <td>name</td>
        <td> <input data-bind="  value: name" ></td>
        <td> <input data-bind="  value: age" ></td>
    </tr>
</tbody>
相关文章：