primeNG 表上的可编辑行问题

Moh*_*ast 5 typescript primeng angular

在我的角度项目中,我使用 primeNG 库,我试图使数据表中的行可编辑,因此我按照文档 [ https://www.primefaces.org/primeng/#/table/edit]来执行此操作,但是我遇到问题,我试图解决它,但失败了。

当我单击编辑按钮时,所有行都变得可编辑,并且应该只是单击的行?

那么我该怎么做并将新数据发送到服务器

我在stackpiltz中的代码 [ https://stackblitz.com/edit/angular-1suual?file=src%2Fapp%2Fsuppliers-info%2Fsuppliers-info.component.ts]

为了澄清

当我点击修改按钮时 就会这样 就会这样

预先感谢您的任何合作

All*_*ash 7

问题在于您添加的 dataKey,它应该是数据中唯一的现有属性名称。由于 col.field 不存在并且始终为 null ,因此它正在编辑所有行。

应该从

<p-table [value]="suppliers" [columns]="cols" editMode="row" dataKey="col.field">
Run Code Online (Sandbox Code Playgroud)

到

<p-table [value]="suppliers" [columns]="cols" editMode="row" dataKey="id">
Run Code Online (Sandbox Code Playgroud)

这是演示 - https://stackblitz.com/edit/angular-tq7rmc