Блог

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

 [formControl]="control"
  

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

Обновление произошла ошибка типа, 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