How to set hover properties on ngStyle in Angular 14

Question

Hi Is it possible to use hover in ngStyle

<mat-option *ngFor="let option of matSelectOptions" 
    value="option.value" 
    [ngStyle]="{'color': matSelectOptionsTextColor, 
    'background-color': matSelectOptionsBackgroundColor, 
    'hover:font-weight': 'bold'}">
        {{option.text}}
</mat-option>

I would like the Option Text to be bold on hover...

Answer 1

Since hover is a pseudo class it can not be accessed using ngStyle or style. It can however be accessed using class or ngClass by defining bold in the stylesheet and referring to the class name.