Angular 5: триггерный коврик-автозаполнение при нажатии определенной клавиши - PullRequest
Новая
       14

Angular 5: триггерный коврик-автозаполнение при нажатии определенной клавиши

0 голосов
/ 27 марта 2019

Я пытаюсь придумать что-то похожее на функцию тегирования в Facebook, т. Е. Всякий раз, когда нажимается клавиша «@», мое автозаполнение должно запускаться, и я должен иметь возможность увидеть опцию, соответствующую сообщению, напечатанному «@».1001 *

Я не могу связать автозаполнение при нажатии клавиши (или при любом событии)

Буду признателен за любые предложения о том, как добиться этой функциональности, Моим последним средством будет мой собственный модуль автозаполнения

1 Ответ

2 голосов
/ 27 марта 2019

Для этого вы можете сделать следующее.

Создайте ViewChild, чтобы получить ссылку на MatAutocompleteTrigger

@ViewChild(MatAutocompleteTrigger) _auto: MatAutocompleteTrigger;

Создайте HostListener для установки значения formControl на @ и откройте панель при нажатии клавиши @. 

@HostListener('document:keydown', ['$event']) onKeydownHandler(event: KeyboardEvent) {
    if (event.key == '@') {
      this.stateCtrl.setValue('@');
      this._auto.openPanel();
    }
  }

Stackblitz

В этом стеке бликов, нажмите на представление, чтобы установить фокус, или событие не вызовет HostListener

https://stackblitz.com/edit/angular-4x3zte?embed=1&file=app/autocomplete-overview-example.ts

...