Question

我必须为PrimeNG表动态生成数据源，因为我不知道会有多少列，甚至不知道每列的标题。我需要使用2路数据绑定来编辑表格。我正在尝试使用二维数组保存数据（gridData：number [] []）并动态创建列列表，如{index：0，header：“ col1”}等。显示网格正确地使用正确的初始值，但所做的更改不会记录回网格。 PrimeNG文档指出，元素上的[editablecolumnfield]指令应将其命名为“ field”，但这些条目没有字段名，只是具有索引，因为数据表不是具有成员的对象数组，而是具有成员的对象数组索引。甚至可以将2向数据绑定到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维数据绑定对于2维数组工作正常。

PrimeNG表绑定到二维数组

1 个答案: