如何在Angular/PrimeNg中将表格选中项传入函数?
可以实现,具体操作如下
要把PrimeNG表格的选中项传入自定义函数,没法直接在HTML里凭空获取选中项,得借助表格的selection双向绑定属性,配合组件类的变量来完成:
- 在组件类中声明存储选中项的变量
// 组件类.ts文件中 selectedItems: any[] = []; // 可根据你的数据类型调整,比如替换成对应的Item类型
- 给p-table添加selection双向绑定
修改你的p-table标签,绑定选中项变量:
<p-table [value]="items" [(selection)]="selectedItems"> <ng-template pTemplate="body" let-item> <tr [pSelectableRow]="item"> <td> <!-- 修正pSelectableRow的绑定值,和行的绑定保持一致 --> <p-tableCheckbox [pSelectableRow]="item" [value]="item" ></p-tableCheckbox> </td> <td class="cell-breakWord">{{ item.name }}</td> <td>{{ item.id }}</td> ... </tr> </ng-template> </p-table>
- 按钮点击时传入选中项
直接把绑定好的selectedItems变量传给自定义函数:
<p-button (onClick)="yourCustomFunction(selectedItems)">Button</p-button>
这样点击按钮时,选中的表格项就会作为参数传入你的自定义函数中。
内容的提问来源于stack exchange,提问作者Contractor
相关产品推荐
相关产品推荐

