Угловые формы - доступ к FormArray в шаблоне дочернего компонента

Question

У меня есть компонент, который принимает несколько FormControl с и FormArray с в качестве входных данных. Я получаю доступ к FormControl s из дочернего компонента следующим образом:

[formControl]="control"

Это прекрасно работает, но я не могу найти способ сделать то же самое с FormArray. Там, кажется, нет директивы для этого. Я хотел бы избежать передачи ряда строк и доступа через formControlName и formArrayName, если это возможно. Есть ли способ сделать это?

Answer 1

Обновление произошла ошибка типа, jsut исправлен

Вы можете использовать FormArray как FormGroup, но будьте осторожны с «нотацией», если обычно мы используем [formGroup] =«i», теперь мы используем [formGroup] = «group».

Это только думать о том, что такое myFormArray.controls

<form [formGroup]="myFormArray">
  <div *ngFor="let group of myFormArray.controls;let i=index" [formGroup]="group">
    <input formControlName="prop1">
    <div *ngIf="group.get('prop1').invalid">Prop1 Required</div>
    <input formControlName="prop2"/>
    <div *ngIf="group.get('prop2').invalid">Prop2 Required</div>
  </div>
</form>

myFormArray=new FormArray([
    new FormGroup({
      prop1:new FormControl('',Validators.required),
      prop2:new FormControl('',Validators.required)
    })
  ])

Если ваш FormArray является FormArray элементов управления, используйте непосредственно formControl

<form [formGroup]="myFormArray2">
  <div *ngFor="let group of myFormArray2.controls">
    <input [formControl]="group">
    <div *ngIf="group.invalid">Required</div>
  </div>
</form>

myFormArray2=new FormArray([
    new FormControl('',Validators.required),
    new FormControl('',Validators.required)
  ])

См. stackblitz