Angular Form 的一些问答

Angular Form 的一些问答

如何理解FormGroup, FormArray, FormControl?

它们可以映射成对象，数组，原生字段

FormGroup 上的invalid 字段是如何获取整个表单的状态的？

• 首先，它的状态是存在于它内部的Status字段。
• 其次，每单它内部的一个节点有值的改动，会调用updateValueAndValidity()方法，而且改方法是递归它的parent 调用的。在FormGroup 内部它会递归遍历它的孩子获取每个节点的状态，从而得到了表单的状态。
  简单来说，只有有一个节点触发了上述的方法，并且冒泡到了根节点，那么表单根节点的状态就计算更新了

FormGroup上是如何获取到表单的值的。

• 它是通过递归调用它的孩子得到整个值得

某个节点更新值了，会发生哪些事？

• 首先，它会更新节点自己得值，重置本身得状态。
• 然后触发自身得validator, 先触发同步得validator, 如果通过，则触发异步的validator, 从而得到最终的状态值。！！！！！注意这一步只有在enabled 的状态下才会做
• 如果参数中指明发事件(opt.emitEvent)，则会发布ValueChanges, StatusChanges 事件
• 如果参数中指明冒泡事件(opt.onlySelf==false),则递归这个流程到父级，直到根节点。

有时某个节点的验证需要其他节点的参与，这边又两个问题

• 如何获取整个表单的值，可以通过FormControl的parent 递归得到根节点，从而得到整个表单的值
• 如何触发其他节点的validator,可以通过根节点找到相关联的节点，然后调用它的updateValueAndValidatiy({onlySelf:true,emitEvent:false});

FormControl 里面的regsterOnChange 与ValueChanges 的区别

• 这两种的目的是一致的，就是值改变时，触发事件通知订阅者
• regesterOnChange 只有FormControl有， ValueChanges 则是标准的形式，FormArray/FormGroup/FormControl 都有。
• regesterOnChange 在setValue方法中触发，而ValueChanges 则是在updateValueAndValidity中被触发。而setValue方法内部会自动调用updateValueAndValidity.
• 这两种方法都可以通过opts 的配置项给跳过，只是配置项不同
• 简单的说，regesterOnChange 更像是内部方法，配合ValueControlAccessor来使用的，它的触发要早于ValueChanges.其他的并无差别。平时我们的代码推荐使用ValueChanges事件。

setValues vs patchValues，有什么区别

• 这两者都是来更新值得
• 区别是，patchValues 的值如果找不到对应的节点，会自动忽略。而setValues则会报错。