PrimeNG table 绑定到二维数组

Question

我必须为我的 PrimeNG table 动态生成数据源，因为我不知道我将拥有多少列，甚至不知道每列的 Header 是多少。我需要 table 成为具有 2 向数据绑定的 editable。我正在尝试使用二维数组来保存数据 (gridData: number[][]) 并动态创建列列表作为 {index: 0, header: "col1"},等。网格显示正确，初始值正确，但更改不会记录回网格。 PrimeNG 文档指出元素上的 [editablecolumnfield] 指令应命名为 'field'，但这些条目没有字段名称，只有索引，因为数据 table 不是包含成员的 objects 数组，而不是包含索引的数组数组。甚至可以将 2 向数据绑定到二维数组吗？

我是 Angular 开发和 PrimeNG 的新手，所以如果我做错了，请指出正确的方向。

  <p-table [columns]="gridCols" [value]="gridData"> 
    <ng-template pTemplate="header" let-gridCols>
      <tr>
        <th *ngFor="let col of gridCols">
          {{col.header}}
        </th>
      </tr>
    </ng-template>
    <ng-template pTemplate="body" let-gridRow let-columns="gridCols">
      <tr>
        <td *ngFor="let col of gridCols" [pEditableColumn]="gridRow" [pEditableColumnField]="col.index">
          <p-cellEditor>
            <ng-template pTemplate="input">
              <input type="number" ([ngModel])="gridRow[col.index]" /> 
            </ng-template>
            <ng-template pTemplate="output">
              {{gridRow[col.index]}}
            </ng-template>
          </p-cellEditor>
        </td>>
      </tr>
    </ng-template>
  </p-table>

Answer 1

这是严重的细节错误之一...您在输入字段中放错了双向数据绑定的括号。 []-括号似乎必须是 ngModel.

周围的外括号

你的：

<input type="number" ([ngModel])="gridRow[col.index]" />

正确：

<input type="number" [(ngModel)]="gridRow[col.index]" />

除此之外，2 向数据绑定对二维数组也适用。

PrimeNG table 绑定到二维数组

PrimeNG table binding to a 2-dimensional array

data-binding

multidimensional-array

angular

primeng-datatable