使用指令从表单中的多个输入字段中删除 $error 消息

Question

我在表单中有几个字段：

<input name="participant{{$index}}email" type="email" ng-model="participant.email" ng-trim="true"
                           required ng-minlength="1" ng-maxlength="255"
                           email-uniqueness-validator="{{$index}}">

我使用 emailUniquenessValidator 指令来检查是否有任何参与者输入了相同的电子邮件。如果是这样，我会显示错误消息：

<div ng-messages="enroll['participant' + $index + 'email'].$error">
    <div ng-message="emailUniqueness">The email addresses must be different for every applicant...</div>
</div>

问题是当我有两个字段具有相同的电子邮件并且它们都显示错误时。然后用户编辑一封电子邮件，使其不同于任何其他电子邮件，并且该字段上的错误消息按预期消失，但是如何从第二个电子邮件字段中删除通过编辑第一个电子邮件字段变得唯一的错误消息？

指令：

.directive('emailUniquenessValidator',
    function() {
        return {
            require : 'ngModel',
            link: function (scope, element, attrs, ngModel) {
                scope.$watch(attrs.ngModel, function () {
                    var currentEmailFieldNo = attrs.emailUniquenessValidator;
                    var diffEmails = differentEmails(scope, currentEmailFieldNo);
                    ngModel.$setValidity('emailUniqueness', diffEmails);
                    if (!diffEmails) {//one field has changed and there is no duplicates, but we need to remove validation errors from the other field
                        cleanDuplicateEmailErrors(scope);
                    }
                });
            }
        }
    });

不同的电子邮件功能：

function differentEmails(scope, currentEmailFieldNo) {
    differentEmails = true;
    var currentEmail = currentEmailFieldNo >= 0
        ? scope.applicantEnrollDto.participants[currentEmailFieldNo].email
        : scope.applicantEnrollDto.email;
    var mainEmail = scope.applicantEnrollDto.email;
    if (currentEmailFieldNo < 0) {
        if (emailInArray(currentEmail, scope.applicantEnrollDto.participants)) {
            differentEmails = false;
        }
    } else {
        var applicantsNo = scope.applicantEnrollDto.participants.length
        var differentEmails = true;
        if (applicantsNo) {
            differentEmails = !hasDuplicates(scope.applicantEnrollDto.participants);
            if (differentEmails) {
                if (currentEmail === mainEmail) {
                    differentEmails = false;
                }
            }
        }
    }
    return differentEmails;
}

Answer 1

通过访问范围内的表单轻松解决了问题

$scope.form["participant"+i+"email"].$setValidity('emailUniqueness', errorsOff);

使用指令从表单中的多个输入字段中删除 $error 消息

remove $error message from several input fields in the form using directive

angularjs

angularjs-directive

angular-ngmodel