ngx 数据表中的 ngFor

如何解决ngx 数据表中的 ngFor

我有一个 ngx 数据表，它显示来自 json 对象的数据，带有行项目。 但我想将表单验证器添加到表上的输入字段。

我有单元格模板来显示每列的自定义字段。 我调查了将表单控件添加到您应该使用 formarray 的表 问题是当添加 ngFor 时，我的字段的输入消失了

<div [formGroup]="tableValidate">
  <prx-card>
    <prx-card-body class="prx-card-body-pya">
      <ng-container *ngIf="userstemplate && userstemplate.length; else loadingList">
        <ngx-datatable
          class="listview responsive"
          [rows]="userstemplate"
          [columns]="columns"
          [columnMode]="ColumnMode.force"
          headerHeight="auto"
          [rowHeight]="false"
          footerHeight="auto"
          [limit]="5"
          [selectionType]="SelectionType.checkBox"
          [selectAllRowsOnPage]="false"
          (select)="onSelect($event)"
          [summaryRow]="enableSummary"
          [summaryPosition]="summaryPosition"
          [summaryHeight]="0"
        >
          <ngx-datatable-footer>
            <ng-template
              ngx-datatable-footer-template
              let-rowCount="rowCount"
              let-pageSize="pageSize"
              let-selectedCount="selectedCount"
              let-curPage="curPage"
              let-offset="offset"
            >
              <div style="padding: 5px 10px">
                <div>
                  <strong>Totales</strong>: Lunes: {{ totalLunes }} | Martes: {{ totalMartes }} | Miércoles:
                  {{ totalMiercoles }} | Jueves: {{ totalJueves }} | Viernes: {{ totalViernes }}
                </div>
                <hr style="width: 100%" />
                <div>Filas: {{ rowCount }} | Página actual: {{ curPage }} | Seleccionados: {{ selectedCount }}</div>
              </div>
            </ng-template>
          </ngx-datatable-footer>
        </ngx-datatable>
      </ng-container>

      <ng-template #loadingList>
        <prx-loader template="list" [isLoading]="isLoading" [count]="2"></prx-loader>
      </ng-template>
    </prx-card-body>
  </prx-card>
  <!--SELECT-->
  <ng-template #selectTemplate let-value="value" let-row="row" let-column="column" let-rowIndex="rowIndex">
    <div class="pya-cell">
      <small class="text-muted d-block d-lg-none">{{ column.name }}</small>
      <span
        *ngIf="!appearSelectColumn[rowIndex][column.name]"
        (dblclick)="appearSelect(rowIndex,column.name,value)"
        >{{ value }}</span
      >
      <label *ngIf="appearSelectColumn[rowIndex][column.name]">
        <select class="form-control form-control-sm">
          <option *ngFor="let option of options">{{ option.nombre }}</option>
        </select>
      </label>
    </div>
  </ng-template>
  <ng-template formArrayName="filas"
               *ngFor="let filas of filasValidator.controls; let i = index"
               #inputTemplate
               let-value="value"
               let-row="row"
               let-column="column"
               let-rowIndex="rowIndex">
    <label [formGroupName]="i" class="pya-cell">
      <small class="text-muted d-block d-lg-none">{{ column.name }}</small>
      <!--REVISAR VALUE,DA ERROR DE REASIGNACION -->
      <input
        (input)="editHour(rowIndex,column.prop,$event)"
        formControlName="dia"
        type="number"
        value="{{ value }}"
        class="number text-center w-50 form-control light"
      />
    </label>
  </ng-template>
  <!--CHECKBox-->
  <ng-template
    #checkBoxTemplate
    let-column="column"
    let-isSelected="isSelected"
    let-onCheckBoxChangeFn="onCheckBoxChangeFn"
  >
    <label class="pya-cell">
      <small class="text-muted d-block d-lg-none">{{ column.name }}</small>
      <prx-checkBox [checked]="isSelected" (onChanged)="onCheckBoxChangeFn($event)"></prx-checkBox>
    </label>
  </ng-template>
  </div>

enter image description here