首页 > 解决方案 > 用于多个电子邮件 ID 文本区域控件的 Angular JS 自定义指令

问题描述

我是 AngularJS 的新手,我创建了一个自定义指令来检查给定文本区域中的无效电子邮件,并用逗号分隔。

directive(directiveId, function () {
    return {
        require:"ngModel",
        controller: controllerId,
        link: function multipleEmailValidator(scope, element, attributes, controller) {
            controller.$validators.emailListValidation = function (scope,modelValue, viewValue) {
                if (!controller.$isEmpty(viewValue)) {

                    // Get value on emails input as a string
                    var emails = viewValue;

                    // Split string by comma into an array
                    emails = emails.split(",");

                    var regex =
                        /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

                    var invalidEmails = [];

                    for (var i = 0; i < emails.length; i++) {
                        // Trim whitespaces from email address
                        emails[i] = emails[i].trim();

                        // Check email against our regex to determine if email is valid
                        if (emails[i] === "" || !regex.test(emails[i])) {
                            invalidEmails.push(emails[i]);
                        }
                    }
                    scope.message = "Invalid emails: " + invalidEmails.join(", ");

                }

            };
        }

}; });

html代码:

 <tr class="fit">
                        <td><label class="standard-left-label">To:</label></td>
                        <td>
                            <textarea class="standard-textarea"
                                      style="height: 110px; width: 350px;"
                                      maxlength="200"
                                      ng-model="email.toList"
                                      ng-class="readOnly ? 'k-state-disabled' : ''"
                                      ng-readonly="readOnly" email-List-Validation></textarea>
                        </td>
                    </tr>

我得到的错误

在此处输入图像描述

我无法理解为什么会出现这个错误。如何解决此错误的任何指导都会对我有所帮助。

谢谢,纳加斯里。

标签: angularjs

解决方案


推荐阅读