Событие с вкладкой Handle в Angular 2

Как я могу обработать событие нажатия клавиш Tab в Angular 2. Я взял это из DOC of Angular, чтобы получить keyCode, он хорошо работает, когда я нажимаю другие клавиши, но когда я нажимаю Tab, ничего не происходит ,Событие с вкладкой Handle в Angular 2

import { Component } from '@angular/core'; 

@Component({ 
selector: 'my-app', 
template: `<input (keyup)="onKey($event)"> 
      <p>{{values}}</p>` 
}) 

export class AppComponent { 
    values = ''; 
    onKey(event: any) { 
    this.values += event.keyCode+ ' | '; 
    } 
}

Кроме того, это правильный способ сделать это в угловых 2

<input ng-keydown="($event.keyCode == 9) && 
     signal('something')" />

источник

2017-02-15 freeNinja

<input (keydown.Tab)="onKey($event)">

источник

2017-02-15 04:14:06

Спасибо! Могу ли я также использовать его в элементе div? – freeNinja

Вам нужно добавить 'tabundex =" 0 ", чтобы div мог получать фокус и события клавиатуры. –

Большое вам спасибо! это подходит для меня. Есть ли способ предотвратить события по умолчанию Tab. event.preventDefault()? – freeNinja

<input (keypress)="someFunction($event.target.value)"/>

источник

2017-02-15 04:47:46

У меня была аналогичная проблема. Сначала я попытался использовать $event в шаблоне, но после некоторого чтения here кажется, что минус $event - это не то, что Angular team поощряет (см. Ссылку для подробностей). Они рекомендуют использовать опорные переменные шаблона. Это было хорошо, пока я не попытался использовать вкладку, и я получил то, что получал @freeNinja; вкладка будет работать, но затем направьте фокус на верхнюю часть страницы. Ответ @ Günter Zöchbauer в комментариях выше работал для меня. Добавление false после вызова метода остановило передачу фокуса. (keydown.tab)="saveEntry(i, newCost.value); false

источник

2017-06-21 14:29:56 Hodglem

Событие с вкладкой Handle в Angular 2

ответ

Смежные вопросы