Angular Material. to highlight a table row on mouse over

angular-material angular-material2

Vladyslav Plakhuta · Apr 9, 2018 · Viewed 36.9k times · Source

we are using Angular Material table for our app:

https://material.angular.io/components/table/overview

<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>

could you please to show how to highlight a row on mouse hover?

Answer

Add some CSS with the :hover selector to the mat-row elements:

.mat-row:hover {
  background-color: red;
}