Question

我目前正在尝试使用Angularjs创建动态表单。出于测试目的，表单有3个字段，这些字段是通过ng-repeat指令动态添加的。

这是JSFiddle：http://jsfiddle.net/charms/4E7zQ/3/

问题：

我目前尝试动态设置验证指令。我想了解以下内容：

<input ng-model="item.value" name="{{item.name}}" type="{{item.type}}" placeholder="{{item.placeholder}}" {{item.validators}}/>

{{item.validators}} 但不起作用。有人知道如何在动态字段创建过程中添加和删除基本和自定义验证器吗？

我想在动态添加的表单字段中添加不同的验证器，如果删除字段，还要删除验证器：

<input ng-model="user.email" name="email" type="email" placeholder="E-Mail" required email-available/>
<input ng-model="user.firstName" name="firstName" type="email" placeholder="Firstname" required/>
<input ng-model="user.lastName" name="lastName" type="email" placeholder="Lastname" required"/>

Angularjs有可能吗？

例如，字段和验证应根据用户点击的单选按钮而改变。我想通过删除字段并使用动态添加到其中的不同验证指令再次添加它来实现此目的。

正如您在JSFiddle中看到的，当单击“添加”按钮时，将使用“必需”指令创建3个字段。如果删除了一个表单字段（通过单击“删除”按钮实现），则还会删除验证。

现在我想添加另一个带有不同验证指令的字段，例如电子邮件可用或多个验证指令，每个验证指令对于每个创建的字段都是不同的。

如果有人有解决方案，那就太好了。

Answer 1

检查自定义验证页面http://docs.angularjs.org/guide/forms。所有验证都在ngModel控制器中进行。有两个数组用于保存消毒剂和验证器 - $formatters和$parsers。我要做的是编写一个指令，将一个验证器列表作为参数，并在上面提到的列表中添加或删除它们。

我看到的唯一问题是重用内置验证器。也许你可以从source中获取验证器函数并输入你的指令。它不是很漂亮，但并不难。

或者您可以自己编写验证器。他们每个人都只是一个正则表达式。以下是我的团队一直在做的事情：

.value('validators', (function () {
    function validatorFromRegex(regex) {
        return function (value) {
            return (!value) ? true : (value.toString().match(regex) !== null);
        };
    }
    return {
        required: function (value) { return (value !== ''); },
        path: validatorFromRegex(/^\/?([0-9A-Za-z]+[\-\/]?)*[0-9A-Za-z]+$/),
        tag: validatorFromRegex(/^([0-9A-Za-z]+\-?)*[0-9A-Za-z]+$/),
        date: validatorFromRegex(/^(0[1-9]|1[012])\/(0[1-9]|[12][0-9]|3[01])\/(19|20)\d\d$/),
        spotify: validatorFromRegex(/^spotify:user:fusetv:playlist:[a-zA-Z0-9]{22}$/),
        url: validatorFromRegex(/^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/),
        twitter: validatorFromRegex(/^[A-Za-z0-9_]{1,15}$/),
        number: validatorFromRegex(/^\d+$/),
        phone: validatorFromRegex(/^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/),
        zipcode: validatorFromRegex(/^\d{5}(-\d{4})?$/)
    };
})())

如何动态添加或删除验证

1 个答案: