Как предотвратить закрытие меню Angular / Material на клавиатуре (вкладка)? - PullRequest
0 голосов
/ 03 июня 2018

Я прочитал Как предотвратить закрытие меню углового материала? , в котором объясняется, как предотвратить закрытие меню углового материала при нажатии.

Однако: Кажется, я не могу найти способ предотвратить закрытие меню, когда нажимаю на табулятор для изменения фокуса .

Возьмем этот StackBlitz в качестве примера: https://stackblitz.com/edit/angular-ij6jbx: он правильно предотвращает mat-menu от закрытия , когда поля ввода получают фокус щелчком мыши .С другой стороны: если я нажимаю «табулятор», чтобы изменить фокус, и username -входное поле получает фокус, меню закрывается.

Я хотел бы знать, как предотвратить это поведение - если этовозможный.Я пытался присоединить $event.stopPropagation(); к (input), но, похоже, он ничего не делал.

Очевидно, что некоторые разработчики Angular об этом думали согласно https://github.com/angular/material2/issues/2612. К сожалению, неткажется правильным решением в конце вопроса / функции-запроса, ни подсказкой о статусе.

Ps: Я знаю, что текущий код не красивый и не очень умный,Я собирался преобразовать это в свою собственную директиву, как только она сработает как для щелчка, так и для нажатия клавиши.

1 Ответ

0 голосов
/ 03 июня 2018

Я бы поймал keydown событие следующим образом:

<mat-menu ...>
  <form (keydown.tab)="$event.stopPropagation()">

Forked Stackblitz

Также я бы добавил tabindex="-1" квсе понятные кнопки

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...