angular - 如何创建具有角度动态垫步的动态形式？

Question

我想用动态表单创建动态垫步骤，但是当我创建并单击提交按钮时，表单包含所有表单控件名称，我不知道如何分开

<div *ngIf="datatables">
  <mat-step *ngFor="let datatable of datatables" [stepControl]="clientGeneralForm">
    <ng-template matStepLabel>{{datatable.registeredTableName}}</ng-template>
    <form class="form-horizontal" (ngSubmit)="SubmitDatatable(datatable)" [formGroup]="datatableForm">
      <h3>{{datatable.registeredTableName}}</h3>
      <div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column"
        *ngFor="let columnHeader of datatable.columnHeaderData | slice:1">

        <mat-form-field fxFlex="48%">
          <mat-label>{{ columnHeader.columnName }}

          </mat-label>
          <div *ngIf="fieldType(columnHeader.columnDisplayType) == 'TEXT'">
            <input [required]="!columnHeader.isColumnNullable" [formControlName]="columnHeader.columnName"
              matInput />
          </div>
          <div *ngIf="fieldType(columnHeader.columnDisplayType) == 'DATE'">
            <input [formControlName]="columnHeader.columnName" [required]="!columnHeader.isColumnNullable" matInput
              [matDatepicker]="DatePicker" />
            <mat-datepicker-toggle matSuffix [for]="DatePicker"></mat-datepicker-toggle>
            <mat-datepicker #DatePicker></mat-datepicker>
          </div>
        </mat-form-field>
      </div>

      <div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
        <button mat-raised-button [routerLink]="['../']">
          {{dictionary.info?.label_button_cancel}}
        </button>
        <button [disabled]="!clientGeneralForm.valid" mat-raised-button matStepperNext type="submit">
          {{dictionary.info?.label_button_next}}&nbsp;&nbsp;
          <fa-icon icon="arrow-right"></fa-icon>
        </button>
      </div>
    </form>
  </mat-step>
</div>

TS

    SubmitDatatable(datatable: any) {
    this.datatableData = this.datatableForm.value;
  }

它取决于表，动态创建步骤，例如如果有两个表，则使用不同的formcontrolnames创建两个步骤，当你给它提交时，它包含所有表的formcontrolnames，我想要的是它只包含步骤的形式

标签： angulartypescript