onRowSelect / onRowClick 根本没有被触发。 - Primeng table - Angular
onRowSelect / onRowClick not getting triggered at all. - Primeng table - Angular
我实际上需要遍历到另一个组件,其中包含单击行时选择的数据。我一直在使用 p-table 来执行相同的操作。我完全不知道为什么。 onRowClick / onRowSelection 不会在 all.I 触发,甚至添加了 console.log 字符串以查看是否至少调用了方法,但没有。甚至 [(selection)] 也表现不佳。 p-table 没有问题,因为分页和全局过滤器实际上运行良好并且没有问题。但这是我无法弄清楚原因的事情。 Primeng 版本 "primeng": "^7.1.3"
<p-table [columns]="cols" [value]="companiesList" selectionMode="single"
(onRowClick)="handleSelect($event)"
>
<ng-template pTemplate="header" let-columns>
<tr>
<th *ngFor="let col of columns" [pSortableColumn]="col.field">
{{col.header}}
<p-sortIcon [field]="col.field"></p-sortIcon>
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-rowData let-columns="columns">
<tr>
<td *ngFor="let col of columns">
{{rowData[col.field]}}
</td>
</tr>
</ng-template>
</p-table>
可能的替代解决方案:在 <tr>
标记中,添加 (click)="handleSelect(rowData)"
并删除 (onRowClick)
处理程序。
理由:
- 如果 (onRowClick) 绑定不起作用,请绑定到不同的事件。
- let-rowData 迭代中的 rowData 具有行中的信息,这似乎是您需要传递给其他组件的信息。
- 这种方法在过去对我来说很成功,p-table 可以在用户点击某行时进行捕捉。
虽然很久以前就提出了这个问题,但也许这会对其他人有所帮助。
事件不是onRowClick(),而是onRowSelect() 所以你需要说:
<p-table [columns]="cols" [value]="companiesList" selectionMode="single"
(onRowSelect)="handleSelect($event)"
还有一个 onRowUnselect() 可用。还要确保在行的 html:
中指明行是可选的
<ng-template pTemplate="body" let-rowData let-columns="columns">
<tr [pSelectableRow]="rowData">
我实际上需要遍历到另一个组件,其中包含单击行时选择的数据。我一直在使用 p-table 来执行相同的操作。我完全不知道为什么。 onRowClick / onRowSelection 不会在 all.I 触发,甚至添加了 console.log 字符串以查看是否至少调用了方法,但没有。甚至 [(selection)] 也表现不佳。 p-table 没有问题,因为分页和全局过滤器实际上运行良好并且没有问题。但这是我无法弄清楚原因的事情。 Primeng 版本 "primeng": "^7.1.3"
<p-table [columns]="cols" [value]="companiesList" selectionMode="single"
(onRowClick)="handleSelect($event)"
>
<ng-template pTemplate="header" let-columns>
<tr>
<th *ngFor="let col of columns" [pSortableColumn]="col.field">
{{col.header}}
<p-sortIcon [field]="col.field"></p-sortIcon>
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-rowData let-columns="columns">
<tr>
<td *ngFor="let col of columns">
{{rowData[col.field]}}
</td>
</tr>
</ng-template>
</p-table>
可能的替代解决方案:在 <tr>
标记中,添加 (click)="handleSelect(rowData)"
并删除 (onRowClick)
处理程序。
理由:
- 如果 (onRowClick) 绑定不起作用,请绑定到不同的事件。
- let-rowData 迭代中的 rowData 具有行中的信息,这似乎是您需要传递给其他组件的信息。
- 这种方法在过去对我来说很成功,p-table 可以在用户点击某行时进行捕捉。
虽然很久以前就提出了这个问题,但也许这会对其他人有所帮助。
事件不是onRowClick(),而是onRowSelect() 所以你需要说:
<p-table [columns]="cols" [value]="companiesList" selectionMode="single"
(onRowSelect)="handleSelect($event)"
还有一个 onRowUnselect() 可用。还要确保在行的 html:
中指明行是可选的<ng-template pTemplate="body" let-rowData let-columns="columns">
<tr [pSelectableRow]="rowData">