Какие есть варианты (keyup) в Angular2?

Следующее отлично работает, когда отпущена клавиша ввода . Какие еще варианты доступны keyupв дополнение к keyup.enter?

<input #inputstring (keyup.enter)="doSomething(inputstring.value)"/>

Это параметры, которые в настоящее время задокументированы в тестах: ctrl, shift, enter и escape. Вот некоторые допустимые примеры привязки клавиш:

keydown.control.shift.enter
keydown.control.esc

Вы можете отследить это здесь, пока нет официальных документов, но они скоро появятся.

Я искал способ привязки к нескольким ключевым событиям - в частности, Shift + Enter - но не нашел хороших ресурсов в Интернете. Но после регистрации привязки keydown

<textarea (keydown)=onKeydownEvent($event)></textarea>

Я обнаружил, что событие клавиатуры предоставило мне всю информацию, необходимую для обнаружения Shift + Enter. Оказывается, это $eventвозвращает довольно подробное событие KeyboardEvent .

onKeydownEvent(event: KeyboardEvent): void {
   if (event.keyCode === 13 && event.shiftKey) {
       // On 'Shift+Enter' do this...
   }
}

Также есть флаги для CtrlKey, AltKey и MetaKey (т. Е. Клавиши Command на Mac).

Нет необходимости в KeyEventsPlugin, JQuery или чистой привязке JS.

Этот файл дает вам еще несколько подсказок, например, keydown.up не работает, вам нужен keydown.arrowup:

https://github.com/angular/angular/blob/630d93150a58581a0d474ebf1befb5d09b6813c5/modules/angular2/src/platform/browser/browser_adapter.dart

Сегодня столкнулись с той же проблемой.

Они плохо документированы, существует нерешенная проблема.

Некоторые для клавиатуры , например пробел:

<input (keyup.space)="doSomething()">
<input (keyup.spacebar)="doSomething()">  

Некоторые для keydown
(могут работать и для keyup):

<input (keydown.enter)="...">
<input (keydown.a)="...">
<input (keydown.esc)="...">
<input (keydown.alt)="...">
<input (keydown.shift.esc)="...">
<input (keydown.shift.arrowdown)="...">
<input (keydown.f4)="...">

Все выше находится по ссылкам ниже:

https://github.com/angular/angular/issues/18870
https://github.com/angular/angular/issues/8273
https://github.com/angular/angular/blob/master/packages/platform- браузер / SRC / dom / events / key_events.ts
https://alligator.io/angular/binding-keyup-keydown-events/

вы можете добавить событие keyup, подобное этому

template: `
  <input (keyup)="onKey($event)">
  <p>{{values}}</p>
`

в компоненте код, как показано ниже

export class KeyUpComponent_v1 {
  values = '';

  onKey(event:any) { // without type info
    this.values += event.target.value + ' | ';
  }
}

Если KeyUp событие находится за пределами CTRL, SHIFT, ENTERи ESCкронштейн, используйте только руководство @Md Аюб Али Саркер в. Единственное псевдо-событие keyup, упомянутое здесь в angular docs https://angular.io/docs/ts/latest/guide/user-input.html, является ENTERключевым. Псевдо-событий нажатия клавиш для цифровых клавиш и алфавитов пока нет.

Не keyCodeрекомендуется использовать keyсвойство вKeyboardEvent

<textarea (keydown)=onKeydownEvent($event)></textarea>

Машинопись:

onKeydownEvent($event: KeyboardEvent){

    // you can use the following for checkig enter key pressed or not
    if ($event.key === 'Enter') {
      console.log($event.key); // Enter
    }


    if ($event.key === 'Enter' && event.shiftKey) {
           //This is 'Shift+Enter' 
    }
}

Один нравится с событиями

(keydown)="$event.keyCode != 32 ? $event:$event.preventDefault()"