Question

我有一个应用程序的注册表单，而角度js负责其验证。

当Angular js不接受其中包含撇号的电子邮件地址时，我遇到了一个问题。 “Pear'lpeerh.shin@xyz.com”。

我发现angularJs不喜欢电子邮件地址中的unicode字符。

有没有其他人遇到过这样的问题，我有兴趣知道我可以选择在angularJs中解决这个问题。

任何意见都表示赞赏。谢谢！

Answer 1

如果html5 <input type=email />不重要，可以使用<input type=text />和模式验证

 <input type="text" ng-model="field" ng-pattern="EMAIL_REGEXP" />

你可以使用@Andy Joslin在他的回答中发布的正则表达式

 $scope.EMAIL_REGEXP = /^[a-z0-9!#$%&'*+/=?^_`{|}~.-]+@[a-z0-9-]+(\.[a-z0-9-]+)*$/i;

Answer 2

AngularJS使用此正则表达式来测试电子邮件：https://github.com/angular/angular.js/blob/master/src/ng/directive/input.js#L4

你能做的就是写一个自己检查的指令。只需从AngularJS复制一个并使用您自己的正则表达式：https://github.com/angular/angular.js/blob/master/src/ng/directive/input.js#L606-L614

myApp.directive('nanuEmail', function() {
  return {
    restrict: 'A',
    require: 'ngModel',
    link: function(scope, elm, attrs, model) {
      //change this:
      var EMAIL_REGEXP = /^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/;
      var emailValidator = function(value) {
      if (!value || EMAIL_REGEXP.test(value)) {
        model.$setValidity('email', true);
        return value;
      } else {
        model.$setValidity('email', false);
        return undefined;
      }
      model.$parsers.push(emailValidator);
      model.$formatters.push(emailValidator);
    }
  };
});

然后你可以这样做：

<input nanu-email ng-model="userEmail">

Answer 3

我刚刚更新了angular.js文件中的正则表达式（在表达式中添加了“'”）并且它可以正常工作，而不进行任何其他更改。

EMAIL_REGEXP = /^ [A-Za-z0-9._%+-']+@[A-Za-z0-9.-]+.[A-Za-z ] {2,4} $ /。感谢Vittore，让我想到更新REGEX。：）

Answer 4

为什么要返回undefined？

重构功能：

var verificationEmail = function (viewValue) {
  if ((typeof viewValue != "undefined") && viewValue != "") {
    return regex.test(viewValue);
  }
};

Answer 5

Angular不支持电子邮件ID中的撇号（'）。如果需要在Angular中验证撇号，则需要更改正则表达式：

(/^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/)

要：

/^[A-Za-z0-9._%+'-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/.

它会完美运作。

使用unicode字符进行Angular JS Email验证

5 个答案: