Question

我如何处理Angular 2中的Tab键按压事件。我从Angular的DOC中获取了这个以获得keyCode，当我按下其他键但当我按下Tab时没有任何反应。

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+ ' | ';
  }
}

另外，这是在Angular 2中执行此操作的正确方法

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

Answer 1

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

Answer 2

我遇到了类似的问题。我最初尝试在模板中使用$event，但在阅读here之后，似乎传递$event并不是Angular团队所鼓励的（详见链接）。他们建议使用模板引用变量。这很好，直到我尝试使用tab，我最终得到了@freeNinja得到的东西;选项卡可以工作，但然后直接焦点到页面的顶部。 @GünterZöchbauer在上面的评论中回答了我的工作。在方法调用之后添加false会停止传输焦点。 (keydown.tab)="saveEntry(i, newCost.value); false

Answer 3

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

在Angular 2中处理Tab事件

3 个答案: