Question

我正在尝试控制用户可以在我的离子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＆＃39;

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

altGraphKey：false

altKey：false

bubbles：true

cancelBubble：false

cancelable：true

charCode：0

clipboardData：undefined

ctrlKey：false

currentTarget：null

defaultPrevented：true

详细信息：0

eventPhase：0

keyCode：0

keyIdentifier：＆＃34; U + 0000＆＃34;

keyLocation：0

layerX：0

layerY：0

位置：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

型：＆＃34; KEYDOWN＆＃34;

view：Window

其中：0

proto ：KeyboardEvent

Answer 1

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

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

请注意我需要这样做，因为我需要一个不同的退格行为，如果你不做任何事情，默认行为是正常行为。

离子3键盘事件，键码始终为0

1 个答案: