AngularJS笔记整理 表单验证基础教程
FORM表单
备注
- 使用指令必须添加name ,并添加novalidate 禁用浏览器原生的验证条件
- input表单域中添加的验证的选项 (required Minimum length Maximum length Matches a pattern Email Number Url)
Matches a pattern 正则匹配
匹配某个正则表达式
<input type="text" ng-pattern="/a-zA-Z/" />
AngularJS 表单验证属性
实列解析
一个简单的表单验证
用户名 必填
<input type="text" name="userName" ng-model="entity.userName" ng-required>
邮箱 必填,符合邮箱格式
<input type="email" name="email" ng-model="entity.email" ng-required>
form 表单验证不合法时,显示错误信息(邮箱同理)
<input type="text" name="userName" ng-required> <div ng-show="form.userName.$dirty && form.userName.$invalid"> <span ng-show="form.userName.$error.required">请填写姓名</span> </div>
ng-required:必填
type="email" 必须符合邮件格式
在验证没有通过的情况下,禁用提交按钮 通过设置disabled属性实现
<button type="submit" ng-disabled="form.$invalid">确定</button>
form.$invalid 当form不合法时,disabled