p-dataTable行上的鼠标悬停事件（primeNg）

Question

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

如果你知道如何用p-dataTable处理鼠标悬停事件，我很高兴知道解决方案:)

提前谢谢。

Answer 1

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

如果你必须使用鼠标悬停，我认为没有任何内置功能，但你可以下载源代码然后将数据表组件放入你的项目中（可能会重命名它并确保更改你的导入您的app.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)"

这样的事情。至于实际的数据显示，你必须决定你想要它的外观，然后相应地实现它[范围超出这个范围]。

我不知道这是否是最好的方式，但我认为这样可行。