能够根据用户在表单中输入的内容给出实时视觉反馈是非常重要的。在人与人沟通的语境中,表单验证给出来的反馈同获得正确输入同等重要。
表单验证不仅能给用户提供有用的反馈,同时也能保护我们的Web应用不会被恶意或者错误的输入所破坏。我们要在Web前端尽力保护后端。
AngularJS能够将HTML5表单验证功能同它自己的验证指令结合起来使用,并且非常方便。AngularJS提供了很多表单验证指令。
要使用表单验证,首先要确保表单像上面的例子一样有一个 name 属性。
所有输入字段都可以进行基本的验证,比如最大、最小长度等。这些功能是由新的HTML5表单属性提供的。
如果想要屏蔽浏览器对表单的默认验证行为,可以在表单元素上添加 novalidate 标记
1. 必填项 required
验证某个表单输入是否已填写,只要在输入字段元素上添加HTML5标记 required 即可:
注释:required 属性适用于以下 类型:text,search,url,telephone,email,password,date pickers,number,checkBox,radio 以及 file