我使用以下模式来验证电子邮件
var re = /^(([^<>()[]\.,;: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,}))$/igm;
从这个小提琴上复制了模式。(http://jsfiddle.net/jquery4u/5rPmV/)效果很好。
我尝试像这样用 AngularJS 实现相同的内容
<input type="text" placeholder="Email" ng-model="Employer.Email" ng-pattern="emailPattern" class="form-control" name="email" required />
<p ng-show="showMessages && registerEmployerForm.email.$error.required" class="text-danger">
Email is required.
</p>
<p ng-show="showMessages && !registerEmployerForm.email.$error.required && registerEmployerForm.email.$error.pattern" class="text-danger">
Email is invalid.
</p>
JavaScript
$scope.showMessages = true;
$scope.Employer = {
"Email": ""
};
$scope.emailPattern = /^(([^<>()[]\.,;: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,}))$/igm;
$scope.RegisterEmployer = function(myForm) {
console.log(myForm)
};
我的小提琴:http://jsfiddle.net/codeandcloud/jusoqs88/
问题是,如果我尝试 naveen@naveennaveen.com,第一把小提琴通过了,第二把小提琴失败了。我的问题
- 为什么对于相同的模式,AngularJS的行为不同?
- 我的代码有问题吗?
PS:我知道input type="email"
与registerEmployerForm.email.$error.email
相结合是Angular的方法。不幸的是,我无法在这里实现它,因为正则表达式不应该传递类似naveen@naveennaveen
以下是电子邮件验证的正则表达式:
var re = /^[a-z]+[a-z0-9._]+@[a-z]+.[a-z.]{2,5}$/;
更新
我可以看到这在 @
后用 2 个点的小提琴不起作用,但在这里它有效:在线正则表达式测试
UPDATE2
看起来小提琴有问题,在你的代码中试试这个,它会起作用:
var re = /^("")("".+?(?<!)""@)|(([0-9a-z]((.(?!.))|[-!#$%&'*+=?^`{}|~w])*)(?<=[0-9a-z])@))([)([(d{1,3}.){3}d{1,3}])|(([0-9a-z][-w]*[0-9a-z]*.)+[a-z0-9][-a-z0-9]{0,22}[a-z0-9])$/
<link rel="stylesheet" href="http://mbenford.github.io/ngTagsInput/css/ng-tags-input.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
<script src="http://mbenford.github.io/ngTagsInput/js/ng-tags-input.min.js"></script>
<script>
var app = angular.module('ngApp', ['ngTagsInput']);
app.controller('MainCtrl', function($scope, $http) {
$scope.tags = [
{ text: 'abdo@tatwerat.com' },
{ text: 'info@tatwerat.com' },
{ text: 'admin@tatwerat.com' }
];
});
</script>
<div ng-app="ngApp" ng-controller="MainCtrl">
<tags-input ng-model="tags" placeholder="Add Emails" allowed-tags-pattern="^w+([.-]?w+)*@w+([.-]?w+)*(.w{2,3})+$"></tags-input>
<p>Emails : {{tags}}</p>
</div>