手册
目录
AngularJS 提供客户端表单验证。
AngularJS 监控表单和输入字段（input、textarea、select）的状态，并允许您向用户通知当前状态。
AngularJS 还包含有关它们是否已被触摸或修改的信息。
您可以使用标准 HTML5 属性来验证输入，也可以创建自己的验证函数。
客户端验证不能单独保护用户输入。服务器端验证也是必要的。
使用 HTML5 属性 required 指定必须填写输入字段：
此输入字段是必填的：
输入的有效状态是：
点击 "运行实例" 按钮查看在线实例
使用 HTML5 类型 email 指定该值必须是电子邮件：
此输入字段必须是电子邮件：
输入的有效状态是：
点击 "运行实例" 按钮查看在线实例
AngularJS 会不断更新表单和输入字段的状态。
输入字段有以下状态：
$untouched 该字段尚未被触摸$touched 该字段已被触摸$pristine 该字段尚未被修改$dirty 该字段已被修改$invalid 字段内容无效$valid 字段内容有效它们都是输入字段的属性，要么为真，要么为假。
表单有以下状态：
$pristine 尚未修改任何字段$dirty 个或多个字段已被修改$invalid 表单内容无效$valid 表单内容有效$subscribed 表单已被提交它们都是表单的属性，可以为真或假。
您可以使用这些状态向用户显示有意义的消息。例如，如果某个字段是必填项，而用户将其留空，则应该向用户发出警告：
如果该字段已被触摸且为空，则显示错误消息：
名称是必填项。
运行实例 »点击 "运行实例" 按钮查看在线实例
AngularJS 根据表单和输入字段的状态向它们添加 CSS 类。
以下类被添加到输入字段或从输入字段中移除：
ng-untouched 该字段尚未被触摸ng-touched 该字段已被触摸ng-pristine 该字段尚未被修改ng-dirty 该字段已被修改ng-valid 字段内容有效ng-invalid 字段内容无效ng-valid-key 每次验证一个密钥。例如：ng-valid-required，当有多个必须验证的内容时非常有用ng-invalid-key 例如：ng-invalid-required以下类被添加到表单或从表单中移除：
ng-pristine 没有字段尚未被修改ng-dirty 一个或多个字段已被修改ng-valid 表单内容有效ng-invalid 表单内容无效ng-valid-key 每次验证一个密钥。例如：ng-valid-required，当有多个必须验证的内容时非常有用ng-invalid-key 例如：ng-invalid-required如果类代表的值为 false，则这些类将被删除。
请为这些类添加样式，为您的应用程序提供更好、更直观的用户界面。
使用标准的 CSS 应用样式：
运行实例 »
点击 "运行实例" 按钮查看在线实例
也可以设置表单的样式。
为未修改的（原始的）表单和已修改的表单应用样式：
运行实例 »
点击 "运行实例" 按钮查看在线实例
创建一个自己的验证函数需要一些技巧；您必须向应用程序添加新指令，并使用某些指定参数处理函数内部的验证。
创建您自己的指令，包含自定义验证函数，并通过使用 my-directive 引用它。
仅当值包含字符 "e" 时，该字段才有效：
运行实例 »
点击 "运行实例" 按钮查看在线实例
Example Explained:在 HTML 中，新指令将通过使用属性 my-directive 来引用。
在 JavaScript 中，我们首先添加一个名为 myDirective 的新指令。
记住，当命名一个指令时，你必须使用驼峰式命名法，如 myDirective，但调用它时，你必须使用连字符分隔的名称，如 my-directive。
然后，返回一个对象，其中指定我们需要 ngModel，即 ngModelController。
创建一个链接函数，它接受一些参数，其中第四个参数 mCtrl 是 ngModelController。
然后指定一个函数，在本例中名为 myValidation，它接受一个参数，该参数是输入元素的值。
测试该值是否包含字母 "e"，并将模型控制器的有效性设置为 true 或 false。
最后，mCtrl.$parsers.push(myValidation); 会将 myValidation 函数添加到其他函数的数组中，这些函数将在每次输入值更改时执行。
运行实例 »验证示例
点击 "运行实例" 按钮查看在线实例
HTML 表单属性 novalidate 用于禁用默认的浏览器验证。
AngularJS 指令 ng-model 将输入元素绑定到模型。
模型对象有两个属性：user 和 email。
由于 ng-show，只有当 user 或 email 为 $dirty 和 $invalid 时，才会显示带有 color:red 的 spans。
相关
视频
RELATED VIDEOS
科技资讯
1
2
3
4
5
6
7
8
9
精选课程
共5课时
17.2万人学习
共49课时
77万人学习
共29课时
61.7万人学习
共25课时
39.3万人学习
共43课时
71万人学习
共25课时
61.6万人学习
共22课时
23万人学习
共28课时
33.9万人学习
共89课时
125万人学习
