表单验证 - 电子邮件验证在 AngularJs 中未按预期工作 | aaa
本文介绍了表单验证 - 电子邮件验证在 AngularJs 中未按预期工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述 我使用 Angular 进行表单验证.
这是我使用的 - plunker-edit 我从 Angularjs 文档中获取了这段代码 - 绑定到表单和控制状态 使用类型作为 email
但是当我运行它并输入 abc@abc
它说它是有效的.我该如何解决这个问题?
<html lang="zh-cn"><头><meta charset="UTF-8"><title>示例 - example-example100-production</title><script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.8/angular.min.js"></script><script src="script.js"></script>头部><body ng-app=""><div ng-controller="控制器"><form name="form" class="css-form" novalidate>电子邮件:<input type="email" ng-model="user.email" name="uEmail" required/><br/><div ng-show="form.uEmail.$dirty && form.uEmail.$invalid">无效:<span ng-show="form.uEmail.$error.required">告诉我们您的电子邮件地址.</span><span ng-show="form.uEmail.$error.email">这不是有效的电子邮件.</span>
</表单>
</html>
P.S:我是 AngularJs 的初学者
以下输入也显示有效
预期的有效电子邮件
解决方案
参考我的另一个回答:AngularJS v1.3.x 电子邮件验证问题
尝试在您的电子邮件输入中使用 ng-pattern.
<input type="email" name="input" ng-model="text" ng-pattern="/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[az]{2,4})$/" required>
它适合您的有效和无效情况.
查看示例:plunk
I am using Angular for form validation.
Here is what I use - plunker-edit I have taken this code from Angularjs documentation - Binding to form and control state Have used type as email
but when I run this and enter abc@abc
it says it is valid. How do I fix this ?
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-example100-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.8/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="">
<div ng-controller="Controller">
<form name="form" class="css-form" novalidate>
E-mail:
<input type="email" ng-model="user.email" name="uEmail" required/><br />
<div ng-show="form.uEmail.$dirty && form.uEmail.$invalid">Invalid:
<span ng-show="form.uEmail.$error.required">Tell us your email.</span>
<span ng-show="form.uEmail.$error.email">This is not a valid email.</span>
</div>
</form>
</div>
</body>
</html>
P.S : I am a beginner in AngularJs
Edit:
Also the following inputs wer also shown valid
Expected Valid Emails
解决方案
Refer to my another answer: AngularJS v1.3.x Email Validation Issue
Try to use ng-pattern in your email input.
<input type="email" name="input" ng-model="text" ng-pattern="/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/" required>
It fits your valid and invalid cases.
See an example: plunk
这篇关于表单验证 - 电子邮件验证在 AngularJs 中未按预期工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!
10-19 05:19