MatMenuTrigger loses focus when clicked

19 Views Asked by At

I have a stand material UI menu

<button mat-icon-button [matMenuTriggerFor]="menu11" id="111" aria-label="Example icon-button with a menu" (mouseover)="setFocus($event)" (focusout)="closeMenu()">111
</button>
<mat-menu #menu11="matMenu">
  <button mat-menu-item>
    <span>Redial</span>
  </button>
</mat-menu>

The problem is, its behavior on Angular 11.2 and 15.2 are different.

On Angular 15.2.9, when the menu trigger is clicked, menu is opened, but focusout occurs immediately.

Our application is operated by keyboard so we want the foucout to happen when user uses tab or shortcut key to switch to another menu item so we need to disable this foucout when menu trigger is clicked. Anyone knows if there's anyway to set it?

Thanks

0

There are 0 best solutions below