在Angular 2中處理選項卡事件

如何在Angular 2中處理Tab鍵按下事件。我從Angular的DOC中拿到了這個keyCode，當我按下其他鍵時它運行良好，但是當我按下Tab時沒有任何反應。在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團隊（詳情請參閱鏈接）。他們推薦使用模板引用變量。這很好，直到我嘗試使用tab，並且我最終得到了@ freeNinja得到的東西;標籤可以工作，但直接關注到頁面的頂部。 @上面的評論@GünterZöchbauer答案爲我工作。方法調用停止焦點傳輸後添加false。 (keydown.tab)="saveEntry(i, newCost.value); false

來源

2017-06-21 14:29:56 Hodglem

在Angular 2中處理選項卡事件

回答

相關問題