AngularJS 电子邮件验证不一致
AngularJS Email validation inconsistency
我有这样一种情况,angular 验证将电子邮件视为有效,但实际上并非如此。验证认为有效的条件是 example@domain
在某些情况下这是可接受的地址吗?
<div class="form-group" ng-class="{ 'has-error': clientForm.email.$dirty && clientForm.email.$invalid, 'has-success': clientForm.email.$valid }">
<label>Email</label>
<span class="text-danger" ng-show="clientForm.email.$error.required">Email is required.</span>
<span class="text-danger" ng-show="clientForm.email.$error.email">Invalid email address.</span>
<input type="email" name="email" class="form-control input-sm" ng-model="client.email" required />
</div>
您可以根据需要使用自定义指令来验证它。这是一个例子。
angular.module('myApp', [])
.controller('myCtrl', function($scope) {
$scope.client = {};
})
.directive('validEmail', function(emailRegex) {
return {
require: 'ngModel',
link: function($scope, $element, $attrs, ngModel) {
ngModel.$validators.validEmail = function(val) {
if (!val) { return true; }
return emailRegex.test(val);
};
}
};
})
.value('emailRegex', /^(([^<>()[\]\.,;:\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,}))$/)
;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.min.js"></script>
<form ng-app="myApp" ng-controller="myCtrl" name="form">
<label>Email</label>
<span class="text-danger" ng-show="form.email.$error.required">Email is required.</span>
<span class="text-danger" ng-show="form.email.$error.validEmail">Invalid email address.</span>
<input type="text" name="email" ng-model="client.email" required valid-email/>
</form>
但是,您应该知道使用 RegEx 验证电子邮件比您想知道的要复杂得多。 Read this.
我有这样一种情况,angular 验证将电子邮件视为有效,但实际上并非如此。验证认为有效的条件是 example@domain
在某些情况下这是可接受的地址吗?
<div class="form-group" ng-class="{ 'has-error': clientForm.email.$dirty && clientForm.email.$invalid, 'has-success': clientForm.email.$valid }">
<label>Email</label>
<span class="text-danger" ng-show="clientForm.email.$error.required">Email is required.</span>
<span class="text-danger" ng-show="clientForm.email.$error.email">Invalid email address.</span>
<input type="email" name="email" class="form-control input-sm" ng-model="client.email" required />
</div>
您可以根据需要使用自定义指令来验证它。这是一个例子。
angular.module('myApp', [])
.controller('myCtrl', function($scope) {
$scope.client = {};
})
.directive('validEmail', function(emailRegex) {
return {
require: 'ngModel',
link: function($scope, $element, $attrs, ngModel) {
ngModel.$validators.validEmail = function(val) {
if (!val) { return true; }
return emailRegex.test(val);
};
}
};
})
.value('emailRegex', /^(([^<>()[\]\.,;:\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,}))$/)
;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.min.js"></script>
<form ng-app="myApp" ng-controller="myCtrl" name="form">
<label>Email</label>
<span class="text-danger" ng-show="form.email.$error.required">Email is required.</span>
<span class="text-danger" ng-show="form.email.$error.validEmail">Invalid email address.</span>
<input type="text" name="email" ng-model="client.email" required valid-email/>
</form>
但是,您应该知道使用 RegEx 验证电子邮件比您想知道的要复杂得多。 Read this.