p-dataTable行上的鼠标悬停事件(primeNg)

Question

我目前正在使用angular2开发Web应用程序的用户界面.我有一个p-dataTable组件(primeNG),当鼠标在这个p-dataTable的一行上时,我想调用一个函数.该函数应检索触发鼠标悬停事件的行的数据.

如果你有任何想法如何使用p-dataTable处理鼠标悬停事件,我将很高兴知道解决方案:)

先感谢您.

Answer 1

您的要求必须是鼠标悬停？我问这个问题是因为您可以使用内置的点击事件，而鼠标悬停并不是一种非常适合移动设备的行为（如果您对此有任何担忧）。

如果您必须将鼠标悬停在上面，我认为没有任何内置内容，但您可以下载源代码，然后将数据表组件放入您的项目中（也许重命名它并确保更改应用程序中的导入）。 module.ts 用于数据表组件），编辑 datatable.ts 文件（如下所示： https: //github.com/primefaces/primeng/blob/master/src/app/components/datatable/datatable.ts）

并劫持(mouseenter)="hover=true" (mouseleave)="hover=false"模板中的事件并将您自己的函数放在那里以执行您想要的操作，例如：

(mouseenter)="showRowData($event)" (mouseleave)="hideRowData($event)"

类似的事情。至于数据的实际显示，您必须决定您希望它的外观，然后相应地实现它[范围超出此范围]。

我不知道这是否是最好的方法，但我认为这会起作用。