Angular 2和Ionic 2：如何处理按键事件

Question

我有一堆ionic 2卡片，我希望在按下某个键（任何键都可以）时翻转它们。 代码如下：

<ion-content padding>
    <ion-card (click)="setTime(7)" *ngIf="status == 'morning'" (keypress)="eventHandler($event)" style="width:80%">
        <img src="https://greatist.com/sites/default/files/Sleeping-Positions-feature.jpg"/>
    </ion-card>
</ion-content>

.ts 代码

eventHandler(keyCode){
        alert('hey vikj');
  }

按下任意键后，我的事件处理程序没有被触发。

- Vik

---

设置正确，但需要将焦点放在ion-card上才能开始监听。单击卡片，然后按下键即可正常工作。如果您希望焦点放在整个页面上，请查看此问题：https://dev59.com/mloU5IYBdhLWcg3wg3So - Z. Bagley

按键事件不会对所有按键（例如退格键）触发，尝试使用keyup或keydown事件。 - CharanRoot

@Z.Bagley 如果您将其发布为答案，我可以接受它作为正确答案。 - Vik

完成，感谢您。 - Z. Bagley

Answer 1

您可以在输入框中使用此函数。

(keypress)="onChange($event.keyCode)" 

- Atif Hussain

Answer 2

它已经设置正确，但需要将焦点放在ion-card上，然后开始监听。点击卡片，然后按下一个键，它应该可以工作。如果您希望焦点在整个页面上，请查看此问题： Angular 2 | listen for keypress event on whole page。

- Z. Bagley