PrimeNG数据表数据获取问题：点击删除按钮无法获取行数据

我帮你排查了这个问题，这是PrimeNG表格开发里很常见的小细节遗漏——你的Delete按钮点击事件没有传递当前行的数据，所以控制台才只会打印出MouseEvent对象，拿不到你需要的行信息。

具体修改步骤： #

1. 更新HTML模板中的按钮点击事件
   在你的表格body模板（也就是pTemplate="body"对应的ng-template）里，把Delete按钮的点击事件改成传递当前行的rowData参数：

   <button pButton type="button" icon="pi pi-trash" class="p-button-danger" (click)="deleteRow(rowData)"></button>
   

   这里的rowData是PrimeNG表格自动帮你暴露的当前行数据，只要你在ng-template里声明了let-rowData（看你代码里应该已经有这个声明了），直接用就行。

2. 修改组件TS文件中的删除方法
   在你的table.component.ts里，把deleteRow方法改成接收行数据参数：

   deleteRow(targetRow: any) {
     // 现在你就能拿到要删除的行数据了
     console.log('待删除的行数据:', targetRow);
     // 接下来写你的删除逻辑，比如从数据源数组中移除该行
     // 假设你的数据源是this.tableData，根据唯一标识过滤掉目标行
     this.tableData = this.tableData.filter(row => row.id !== targetRow.id);
   }
   

为什么之前会失败？ #

如果不给点击事件传递参数，Angular默认会把触发事件的MouseEvent对象作为参数传入方法，这就是你之前控制台只看到MouseEvent的原因。只要把PrimeNG提供的rowData传进去，就能拿到对应行的完整数据了。

内容的提问来源于stack exchange，提问作者Billy