Каковы варианты (keyup) в Angular2?

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

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

Ответы

Ответ 1

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

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

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

Ответ 3

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

<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-привязке.

Ответ 4

вы можете добавить событие 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 + ' | ';
  }
}

Ответ 5

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

Ответ 6

Ударил ту же проблему сегодня.

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

Некоторые для keyup, такие как space:

<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-browser/src/dom/events/key_events.ts
https://alligator.io/angular/binding-keyup-keydown-events/