错误：找不到带有路径的控件：'FormArray -> FormControlName' Angular

如何解决错误：找不到带有路径的控件：'FormArray -> FormControlName' Angular

这是我表单的结构：

this.formData = new FormGroup({
  selectedAnimal: new FormArray([],[Validators.required]),selectedTransport: new FormArray([],roadName: new FormControl({ disabled: true,value: null },Validators.required),roadZip: new FormControl({ disabled: true,planeName: new FormControl({ disabled: true,planeZip: new FormControl({ disabled: true,Validators.required)
});

对应的 HTML

<form [formGroup]="formData" (ngSubmit)="onSubmit()">
  <div class="animal-checkBox-group" formArrayName="selectedAnimal">
    <!-- multiple checkBox options,selecting one is mandatory -->
  </div>

  <div class="animal-checkBox-group" formArrayName="selectedTransport">
    <!-- multiple checkBox options,selecting one is mandatory -->
    <div class="if-checkBox-1-selected">
      <!-- conditional checkBox: if checkBox is selected -> new new form controls -> they should be defined for successful validation -->
      <input type="text" formControlName="roadName">
    </div>
  </div>
</form>

错误：

错误错误：找不到路径控制：'selectedTransport -> roadName'

stackblitz working example

解决方法

在您的情况下，控件呈现在 formarray 抽象控件中，因此您必须为所有控件名称提供表单组，如下所述：

<div [formGroup]="formData">
    Road Name: <input type="text" formControlName="roadName">
</div>

这是工作代码：stackblitz