angular常用的表单验证指令

来源:互联网 发布:视觉识别软件 编辑:程序博客网 时间:2024/05/29 17:06

一、验证表单:

1.required 必填

<input type="text" required>


2.ng-minlength 最小长度

<input type="text" ng-minlength="5">


3.ng-maxlength 最大长度

<input type="text" ng-maxlength="5">


4.ng-pattern 匹配模式

<input type="text" ng-pattern="/[a-zA-z]/">


5.电子邮件

<input type="email">

只要将input的type设为email即可


6.数字

<input type="number">

只要将input的type设为number即可


7.URL

<input type="url">

只要将input的type设为url即可


二、表单回应:

1.未修改过的表单

formName.inputFieldName.$pristine


2.修改过的表单

formName.inputFieldName.$dirty


3.经过验证的表单

formName.inputFieldName.$valid


4.未通过验证的表单

formName.inputFieldName.$invalid


5.错误

formName.inputFieldName.$error

$error对象,它包含当前表单的所有验证内容,以及它们是否合法的信息。



三、样式

.ng-pristine {}

.ng-dirty {}

.ng-valid {}

.ng-invalid {}

.ng-invalid-required {}

.ng-invalid-minlength {}

.ng-valid-maxlength {}



原创粉丝点击