Angular中如何判断FormArray的controls属性为FormGroup而非FormControl

实现逻辑 #

要匹配FormArray的controls仅包含FormGroup的场景，只需对FormArray下的首个control做类型校验即可：同一FormArray的子控件类型必然统一，只需校验首个元素即可覆盖全量场景。

补全后完整代码段 #

someFunction(data: any, useForm: any = false): any {
  const form = useForm || <FormGroup>this.formGroup;

  forEach(data, (value, key) => {
    // Check nested FormArray items that include FormControls (Would likely be from mat-table).
    const formArray = (<FormGroup>form).get(String(key));
    console.log('formArray > ', formArray);

    // 补全后的完整if条件
    if (isArray(value) && formArray instanceof FormArray && formArray.controls.length > 0 && formArray.controls[0] instanceof FormGroup) {
      // 你的业务逻辑
    }
  })
}

条件说明 #

• formArray instanceof FormArray：比单纯判断hasOwnProperty('controls')更严谨，避免其他带controls属性的非FormArray对象误匹配
• formArray.controls.length > 0：增加空数组边界判断，避免空数组时取索引0抛出异常
• formArray.controls[0] instanceof FormGroup：精准区分子控件类型，FormControl类型的子控件会被过滤，符合需求

如果业务场景中需要将空的FormArray也归入FormGroup类型场景，可删除formArray.controls.length > 0判断条件。

内容的提问来源于stack exchange，提问作者js-newb