Ошибка: FormArray в mat-table -> не может найти элемент управления по пути (Angular 6) - PullRequest
Новая
       18

Ошибка: FormArray в mat-table -> не может найти элемент управления по пути (Angular 6)

0 голосов
/ 05 октября 2018

это мой html: 

<form [formGroup]="taskTableForm">
  <div id="divTable">
    <table mat-table formArrayName="taskDetail" [dataSource]="this.dataSource" class="mat-elevation-z8">
      <ng-container matColumnDef="action">
        <th mat-header-cell *matHeaderCellDef> Action </th>
        <td mat-cell *matCellDef="let element">
          <mat-form-field>
            <mat-select formControlName="action" [(ngModel)]="element.action" (valueChange)="actionEdited(element, $event)">
              <mat-option *ngFor="let action of fetchService.actions" [value]="action">{{action.name}}</mat-option>
            </mat-select>
          </mat-form-field>
        </td>
      </ng-container>
      <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
      <tr mat-row *matRowDef="let row; columns: displayedColumns; let i=index" [formGroupName]="i"></tr>
    </table>
  </div>
</form>

и это мой ts: 

 protected taskTableForm: FormGroup;

[...]
     const control = <FormArray>this.taskTableForm.controls["taskDetail"];
     const newTaskGroup: FormGroup = this.initItems();
     control.push(newTaskGroup);
[...]

public initItems(): FormGroup {
    return this.fb.group({
      action: [null, Validators.required],
    });
  }

Ошибка, которую я получаю от моего отладчика: Ошибка: не удается найти элемент управления с путем: 'taskDetails -> action'

Как я должен указать правильный путь?

У меня есть следующий пример: https://stackoverflow.com/a/45155324/5545770 -> Он основан на'normal' table , но он также должен работать на mat-table , верно?

[Update] Я просто установил formGroupName на неправильном теге

Как было: 

<tr mat-row *matRowDef="let row; columns: displayedColumns; let i=index" [formGroupName]="i"></tr>

И как должно быть: 

<td mat-cell *matCellDef="let element; let i=index" [formGroupName]="i">
...