发表于: 2019-11-27 22:24:17
1 1387
今天完成的事:研究了表单验证
明天要完成的事:完成表单验证,研究一下路由守卫
难题:感觉有些奇怪这东西完全没理解,写起来有些懵
收获:
TML5 有一组内置的属性,用来进行原生验证,包括 required
、minlength
、maxlength
等。虽然是可选的,不过你也可以在表单的输入元素上把它们添加为附加属性来使用它们。这里我们把 required
属性添加到 firstName
输入元素上。
当你往表单控件上添加了一个必填字段时,它的初始值是无效的(invalid)。这种无效状态会传播到其父 FormGroup
元素中,也让这个 FormGroup
的状态变为无效的。你可以通过该 FormGroup
实例的 status
属性来访问其当前状态
最常见的校验项是把一个字段设为必填项。本节描述如何为 firstName
控件添加“必填项”验证器。
在 ProfileEditor
组件中,把静态方法 Validators.required
设置为 firstName
控件值数组中的第二项。
响应式表单包含了一组开箱即用的常用验证器函数。这些函数接收一个控件,用以验证并根据验证结果返回一个错误对象或空值。
从 @angular/forms
包中导入 Validators
类。
修补(Patching)模型值
有两种更新模型值的方式:
使用
setValue()
方法来为单个控件设置新值。setValue()
方法会严格遵循表单组的结构,并整体性替换控件的值。使用
patchValue()
方法可以用对象中所定义的任何属性为表单模型进行替换。
setValue()
方法的严格检查可以帮助你捕获复杂表单嵌套中的错误,而 patchValue()
在遇到那些错误时可能会默默的失败。
评论