Survol d'une ligne p-dataTable (primeNg)

Question

Je développe actuellement l'interface utilisateur d'une application web en utilisant angular2. J'ai un composant p-dataTable (primeNG) et je voudrais appeler une fonction quand la souris est sur une rangée de ce p-dataTable. La fonction doit récupérer les données de la ligne qui déclenche l'événement de survol.

Si vous avez une idée comment gérer l'événement-over de la souris avec le p-dataTable, je serai heureux de connaître la solution :)

Merci à l'avance.

Answer 1

Votre exigence doit être le passage de la souris? Je demande parce qu'il y a un click-event intégré que vous pouvez utiliser et le mouse-over n'est pas un comportement très mobile (si cela vous concerne). Si vous devez passer la souris, je ne pense pas qu'il y ait quelque chose de intégré, mais vous pouvez télécharger la source puis mettre juste le composant datatable dans votre projet (peut-être le renommer et assurez-vous de changer votre importation dans votre app.module.ts pour le composant datatable), modifiez le fichier datatable.ts (comme on le voit ici: https://github.com/primefaces/primeng/blob/master/src/app/components/datatable/datatable.ts)

et pirater les (mouseenter)="hover=true" (mouseleave)="hover=false" événements dans le modèle et mettre vos propres fonctions à faire ce que vous voulez , par exemple:

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

quelque chose comme ça. En ce qui concerne l'affichage réel des données, vous devrez décider de la façon dont vous voulez qu'il apparaisse et ensuite l'implémenter en conséquence [portée au-delà de cela].

Je ne sais pas si c'est la meilleure façon, mais je pense que cela fonctionnerait.