[英]Email validation in angular 1.3
我有一個表格,其中有幾個文本框和一個提交按鈕。 文本框之一是電子郵件。 我使用的是angular,下面是我從該參考文獻中找到的代碼: http : //plnkr.co/edit/T2X02OhKSLBHskdS2uIM?p=preview
<form name="inviteUserForm" ng-submit="inviteUser(inviteUserForm.$valid)" novalidate>
Email: <input type="email" name="input" ng-model="text" required>
<br>
<span class="error" ng-show="inviteUserForm.input.$error.required">
Required!
</span>
<span class="error" ng-show="inviteUserForm.input.$error.email">
Not a valid email!
</span>
<br>
<button type="submit" class="btn btn-default btn-primary btn-shaded ng-scope" ng-disabled="sending" translate="">Send Invite</button>
</form>
現在,就像鏈接中的演示一樣,它允許某些項目作為有效的電子郵件地址,例如:
me @ ex =是有效的emailId me@ex.c =是有效的emailId
問題是當我點擊上述電子郵件的提交時,它永遠不會發送到電子郵件地址(因為emailId無效)。
我會很感激任何反饋。
更新-:
感謝您的評論。 根據您的反饋,我已經更新了代碼,現在可以使用ng-pattern了。 以下是使用ng-pattern的實際代碼的屏幕截圖。
仍然有同樣的問題。
像這樣使用ng-pattern
。
<input type="email" name="input" ng-model="text" ng-pattern="/^[az]+[a-z0-9._]+@[az]+\\.[az.]{2,5}$/" required
>
並加一個跨度
<span class="error" ng-show="inviteUserForm.input.$error.pattern">
Invalid email address. !
</span>
在您的控制器中
function validate() {
$scope.isValidEmail = false;
var pattern = /^(([^<>()[\]\\.,;:\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,}))$/;
if ($scope.text) {
if (!pattern.test($scope.text)) {
$scope.isValidEmail = true;
} else {
$scope.isValidEmail= false;
}
}
}
在您的html頁面中
<input type="email" name="input" ng-model="text" ng-change="validateEmail()">
<span ng-show="isValidEmail" class="error">Invalid email address. Please re-enter your email address.</span>
<button type="submit" class="btn btn-default btn-primary btn-shaded ng-scope" ng-disabled="isValidEmail" translate="">Send Invite</button>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.