Как сделать эффект зависания в угловом материале?

Question

У меня есть компонент mat-list-item. Как заставить эффект парения появляться при наведении на него курсора.

<mat-list-item style="cursor:pointer" *ngFor="let sprWellplatform of sprWellplatforms" (click)="onSelectSprWellplatform(sprWellplatform)">
  <h4 mat-line>{{sprWellplatform.name}}</h4> 
  <mat-divider></mat-divider>
</mat-list-item>

Answer 1

Подход:

Вы можете напрямую использовать css hover, чтобы навести курсор на элементы.
Класс mat-list-item добавлен Angular в ваш тег mat-list-item.
Итак, примените `hover`` к этому классу следующим образом:

.mat-list-item:hover {
  background: rgba(0,0,0,.54);
  cursor: pointer;
}

Только MatList Demo

Демо с правильным кодом: https://stackblitz.com/edit/angular-jewgan?file=src%2Fapp%2Fapp.component.html

Пожалуйста, прокомментируйте, если это не поможет.