angular - 按键事件在 ionic 2 Android 中不起作用

Question

按键事件不会在 ionic 2 Android 应用程序中触发。同样适用于 iOS 和浏览器(chrome)平台。我的要求是用一些字符来限制键盘输入。即，不想显示我在输入字段中输入的字符。下面的代码片段如下..

onKeyPress(event) {
    const pattern = /[0-9\.\ ]/;
    let inputChar = String.fromCharCode(event.charCode);
    if (!pattern.test(inputChar)) {
        event.preventDefault();
    }
}

:HTML

<input type="text" (click)="stopProcess()" (keypress)="onKeyPress($event)" />

以上函数在 android 中不触发。谁能建议我解决同样的问题？

Answer 1

我通常使用JS key listener:

page.ts:

ionViewDidLoad() {
    document.addEventListener('keydown', (key) => {this.keydown(key)} );
}

keydown(key){
    console.log('Tadaaah')!
}

---

如果你想为每个键触发事件，在函数 keydown(key) 中，听取 key.keyCode:

keydown(key){
  console.log(key.keyCode);
}

---

按下要触发事件的键，做笔记，然后添加功能:

keydown(key){
  if (key.keyCode == 13){
    this.functionA();
    return;
  }
  if (key.keyCode == 32){
    this.functionB();
    return;
  }
}

functionA() {
   console.log('Function A');
}

functionB() {
   console.log('Function B');
}

---

总结

你的代码应该是这样的:

  ionViewDidLoad() {
    document.addEventListener('keydown', (key) => {this.onKeyPress(key)} );
  }

  onKeyPress(key) {
    const pattern = /[0-9\.\ ]/;
    let inputChar: string = key.keyCode;
    if (!pattern.test(inputChar)) {
      event.preventDefault();
    }
  }