共计 678 个字符，预计需要花费 2 分钟才能阅读完成。
为什么使用验证器
用户输入的数据各式各样, 并不总是正确的, 如果用户输入了错误的数据格式, 那么我们希望给他们提供实时正确的反馈, 并且阻止表单的提交. 因此, 我们需要验证器来处理这些情况.
表单验证
Angular 支持的内置 validate 属性：
required- 设置表单控件值是非空的
email – 设置表单控件的格式是 email
minlength – 设置表单控件值的最小长度
maxlength – 设置表单控件长度的最大值
pattern – 设置表单控件的值需匹配 pattern 对应的模式
通过表单控件的.valid 判断验证结果，其结果状态：
valid – 有效
invalid – 无效
pristine – 表单值未改变
dirty – 表单值已改变
touched – 表单控件已被访问过
untouched- 表单控件未被访问过
Angular 验证器 简单实例
1. 验证器由 Validators 模块提供, 该模块从 ’@angular/forms’ 中导出
import {Validators}from’@angular/forms’
2. 使用验证器的方法（实例）
export class AppComponent {
constructor(private fb: FormBuilder) {
}
profileForm = new FormGroup({
userName: new FormControl(”, Validators.required),
password: new FormControl(”, Validators.required),
});
3. 效果
最后，提及一下我们团队的黄庭祥，虽然跟我说的时候云里雾里的，但是还是感谢！！！