html - 关于 Angular PrimeNG 表格的 formArray

我正在尝试使用 Angular forms 创建 PrimeNg 可编辑表格。我不明白如何使用 formArray。我尝试了很多次，但遇到了 formGroupName 错误。

这是当前行为

※ 实际行为 ⇒ 只有被触碰且无效的组件（输入字段）边框应显示为红色。

※ 我认为这里我们应该使用 formArray 来检查验证。

※ 在另一个组件中添加行按钮。

HTML

<p-table [loading]="loading" styleClass="text-sm " [ngClass]="{'p-datatable-is-loading': loading}" [value]="dataSource"
  [scrollable]="true" scrollHeight="calc(100% + 2px)" scrollDirection="both">
  <ng-template pTemplate="header">
    <tr>
      <th style="width: 250px;">Project</th>
      <th style="width: 250px;">Process</th>
      <th style="width: 200px;">Working Hours</th>
      <th style="width: 168px;">Billed To</th>
      <th style="width: 350px;">What did you work on?</th>
      <th style="width: 350px;">Blockers</th>
      <th alignFrozen="right" pFrozenColumn class="p-frozen-column p-frozen-border-left" style="width: 114px;"></th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" [formGroup]="_formHelper.form" let-source let-index="rowIndex">
    <tr *ngIf="dataSource[index].editing; else viewingMode;" class="editing editing-mode">
      <td style="width: 250px; overflow: visible">
        
<p-autoComplete  appendTo="body" #project name="project" [(ngModel)]="dataSource[index].project_id" [suggestions]="projectSuggestions"
          field="name" (onSelect)="handleSelectProject($event, index)"
          (onBlur)="_formHelper.validateControl('project')" formControlName="project"
          (completeMethod)="handleSearchProject($event, index)" (onFocus)="project.show()" placeholder="Search project">
        </p-autoComplete>

      </td>
      
    </tr>
  </ng-template>
</p-table>
 

TS

export class DailyReportRegularTableComponent extends DailyReportLog implements OnInit {

  helper!: HelperService
  _formHelper: FormService = new FormService;
  _model: UIProjectLogForm = {
    id:  '',
    process:  '',
    minutes:  undefined,
    hour:  undefined,
    work_note:  '',
    blocker_note:  '',
    daily_time_log_id:  '',
    billed_to:  '',
    project_id:  '',
    project_name:  '',
  };

  constructor(private _helper: HelperService,private formBuilder: FormBuilder) {
    super();
    this.helper = this._helper;
    this.initForm();
  }
  
  initForm() {
    this._formHelper.form = this.formBuilder.group({
      project: new FormControl(this._model.project_id, {
        validators: Validators.required,
        updateOn: 'blur'
      })
    });
  }

}