《AngularJS 权威教程》读书笔记,第七章——过滤器。
不知道为啥把表单验证放在这一章,表单验证跟过滤器有毛关系啊!
简介
AngularJS 能够将 HTML5 表单验证功能同它自己的验证指令结合起来使用。
要屏蔽浏览器对表单的默认验证行为,可以在表单元素上添加 novalidate 标记。
要使用表单验证,表单每项上都得有 name 属性。
内置校验指令
- 必填项:required
- 最小长度:ng-minlength=”5”
- 最大长度:ng-maxlength=”20”
- 模式匹配:ng-pattern=”[a-zA-Z]”
- 电子邮件:type=”email”
- 数字:type=”number”
- URL:type=”url”
内置表单字段属性
- 未修改的表单:formName.inputFieldName.$pristine
- 修改过的表单:formName.inputFieldName.$dirty
- 合法的表单:formName.inputFieldName.$valid
- 不合法的表单:formName.inputFieldName.$invalid
- 错误:formName.inputfieldName.$error
内置表单校验CSS样式
与上面的内置表单字段属性对应,分别是:ng-pristine, ng-dirty, ng-valid, ng-invalid, ng-error
自定义表单验证
通过 $parsers 和 $formatters 可以实现自定义表单验证,这两个分别怎么用,我也没看懂。。。下面的例子对自定义表单验证倒是很实用