DataTable Edit 无法用二维验证

Question

我遇到了关于数据表编辑器的问题

我的表是PrimeNG的数据表，这个表可以编辑该行的任意单元格，需要所有单元格：

这里是Datatable的要求：

可以编辑任何单元格 验证任何单元格（必需） 当我完成 2 个要求时，输入为空白时会引发错误

Error: If ngModel is used within a form tag, either the name attribute must be set or the form
  control must be defined as 'standalone' in ngModelOptions.

  Example 1: <input [(ngModel)]="person.firstName" name="first">

我认为问题在于输入具有相同值时名称为空白且重复。

现在我想像这样设置每个输入的属性名称

[name]="`{col.field}` + '_' + `value of first row` + '_' + data[col.field]"

这将使输入是唯一的，我该怎么做或有人建议我其他解决方案

这里是 Plunker https://plnkr.co/edit/n0S4JK1siLvDHypTSpkZ?p=preview

Answer 1

我认为问题在于输入具有相同值时名称为空白且重复。

确实，你是对的。您遇到的错误意味着您必须有一个 name 属性，并且这个属性永远不应该为空。但是，当您删除单元格值时，data[col.field] 变为空，因此name 属性。

所以要解决你的问题，你不应该依赖这个值。因此，您可以做的是分配行索引和列索引的连接。 rowIndex_columnIndex 之类的东西：

<form (ngSubmit)="onSubmit()" #form="ngForm">
<p-dataTable [value]="data" [editable]="true">
  <p-column *ngFor="let col of cols,let j=index" [field]="col.field" [editable]="true" [header]="col.header">
    <ng-template let-col let-data="rowData" pTemplate="editor" let-i="rowIndex">
      <input [(ngModel)]="data[col.field]" pInputText required="true" [name]="i+'_'+j"/>
    </ng-template>
  </p-column>
</p-dataTable> 

其中 i 是行的索引，j 是列的索引。

查看工作Plunker