ionic 3 键盘事件，键码始终为 0

Question

我正在尝试控制用户可以在我的 ionic 3 应用程序中针对特定输入输入的内容。例如，我有一个 input type='text'，我只允许使用数字和下划线，我正在尝试使用键盘事件来实现这一点。

这适用于浏览器，但不适用于实际 android，因为所有 keyCode 均为 0；

请指教如何处理这样的事情，我使用的是最好的方法吗？

Html代码：

<form [formGroup]="pinForm">
  <div class="modal-input">
    <ion-item>
      <ion-input type="text" [(ngModel)]="pin" #pinNumber></ion-input>
    </ion-item>
  </div>
</form>

ts代码：

@ViewChild('pinNumber') inputPin:any;
@HostListener("keydown", ["$event"])
  onKeyDown(e: KeyboardEvent) {
     //here i am controlling the input to do what ever i need
     console.log(e);
  }

上面的代码在 pc 上的浏览器中有效，但在实际设备上无效如下图全0

那么如何知道按下了什么键？

altGraphKey: false

altKey: false

bubbles: true

cancelBubble: false

cancelable: true

charCode: 0

clipboardData: undefined

ctrlKey: false

currentTarget: null

defaultPrevented: true

detail: 0

eventPhase: 0

keyCode: 0

keyIdentifier: "U+0000"

keyLocation: 0

layerX: 0

layerY: 0

location: 0

metaKey: false

pageX: 0

pageY: 0

returnValue: false

shiftKey: false

srcElement: input.text-input text-input-md

target: input.text-input text-input-md

timeStamp: 1516972480017

type:"keydown"

view: Window

which: 0

proto: KeyboardEvent

Answer 1

我最终使用了 type="tel"，因为在旧机器人 type="text" 上，出于某种原因，重置了键盘事件变量。所以在使用 type="tel" 之后，除了退格键之外的所有字符都成功记录了键码，

我使用 (ngModelChange) 来跟踪变化，然后我检查它是否退格，然后我按照我的要求进行处理，但逻辑是检查输入的大小并采取相应的行动。

please note that i needed to do this since i need a different behavior for backspace, if you don't do anything the default behavior is the normal one.

ionic 3 键盘事件，键码始终为 0

ionic 3 Keyboard events, keycode always 0

keycode

keyboard-events

ionic-framework

ionic3

angular