angularjs - 定期验证的 Angular 电子邮件自定义

Question

我需要执行两个步骤才能验证电子邮件。 首先我想使用 Angular

 type="email"

为了检查电子邮件的有效性，我想使用自定义指令将此电子邮件发送到服务器以在那里执行一些检查。

自定义验证指令代码:

angular.module('app.register')
.directive('emailAvailable',['registerResource', function(registerResource) {
return {

    restrict: 'A',

    require: 'ngModel',

    link: function(scope, element, attr, ctrl) {
        function customValidator(ngModelValue) {
            registerResource.emailAvailable.save({"email": ngModelValue},
                function(response){
                    // Show that email is valid
                },
                function(response){
                   // Show that email is not valid
                });
            return ngModelValue;
        }
        ctrl.$parsers.push(customValidator);
    }
};

我的问题是如何在检查 Angular type="email"的有效性后执行我的 customValidator 函数。

Answer 1

使用自定义验证器，您可以执行以下操作:

  var app = angular.module('form-example1', []);
  // only allows e-mail from google
  var EMAIL_REGEXP = /^[a-z0-9](\.?[a-z0-9]){5,}@g(oogle)?mail\.com$/;
  app.directive('email', function() {
    return {
      require: 'ngModel',
      link: function(scope, elm, attrs, ctrl) {
        ctrl.$validators.email = function(modelValue, viewValue) {
          if (ctrl.$isEmpty(modelValue)) {
            // consider empty models to be valid
            return true;
          }

          if (EMAIL_REGEXP.test(viewValue)) {
            // it is valid
            return true;
          }

          // it is invalid
          return false;
        };
      }
    };
  });

Working example here .