Question

我正在将应用程序从Angular 2升级到7，看来我的大多数表格都已损坏。我在多个实例中收到以下错误：

Property 'controls' does not exist on type 'AbstractControl'

在这种特殊情况下，我有一个似乎遍历并验证表单数组的块。

for (let i = 0, len = this.form.controls[control].controls.length; i < len; i++) {

  this.form.controls[control].controls[i].controls.ConditionTypeId.setValidators(Validators.required);
  this.form.controls[control].controls[i].controls.ConditionTypeId.updateValueAndValidity();
  this.form.controls[control].controls[i].controls.ToBeCompletedDate.setValidators(Validators.required);
  this.form.controls[control].controls[i].controls.ToBeCompletedDate.updateValueAndValidity();
}

自Angular 2起，嵌套表单/表单数组的工作方式发生了重大变化，如果是这样，对我而言，重构以嵌套方式处理嵌套表单的代码的最有效方法是什么？

Answer 1

我不确定更改何时发生，因为直到v4才开始认真对待Angular。但我相信您的问题只是对表单类的键入或重组稍加严格。 AbstractControl是这些表单类的通用抽象类。 FormArray类对此进行了扩展，并添加了您要寻找的controls属性。但是FormGroup.controls[...]仅返回通用AbstractControl。因此，您必须先将其转换为FormArray，然后再尝试从中获取控件：

(this.form.controls[control] as FormArray).controls[i].controls...

更常见的模式是为特定数组创建一个吸气剂，但是在您的情况下，支持ts文件的简单函数可能更合适：

getFormArray(controlName) {
  return this.myForm.get(controlName) as FormArray;
}

访问角形式的嵌套控件

1 个答案: