Android KeyUp，KeyDown和KeyPress事件不適用於Angular2

Question

我遇到一個問題，當我運行

 <input type="text" (keydown)="testKeyCodes($event)"/> <!-- or --> <input type="text" (keyup)="testKeyCodes($event)"/> 

我總是在android chrome瀏覽器中得到229的keyCode，我知道在堆棧溢出時已經提到過幾次了，我已經看到了使用的推薦

 <input type="text" (keypress)="testKeyCodes($event)"/> 

代替。 問題是，Android手機未觸發keypress事件。 有沒有人找到解決方案？

我的最終目標是防止android瀏覽器上的用戶在我的字母數字輸入中輸入特殊字符。

下面是我要檢查的正則表達式。

 //tried this testKeyCodes(event) { if (!/[a-zA-Z0-9 ]/.test(event.keyCode) && event.keyCode != '8') { event.preventDefault(); } } //and this testKeyCodes(event) { if (!/[a-zA-Z0-9 ]/.test(String.fromCharCode(event.keyCode)) && event.keyCode != '8') { event.preventDefault(); } } 

任何幫助將不勝感激。 我完全被困住了。

Answer 1

我將編寫一條指令，該指令將使用自定義驗證器來監聽input事件，如下所示：

....
@HostListener('input',['$event']) 
    onInput($event){
      let newValue = this.el.nativeElement.value;
      ...   
      let patternValidation=newValue.match(myPattern); //replace here with your regexp

      if(patternValidation){
         //keep input
      } else {
         //exclude input
         newValue = patternValidation;
      }

      this.model.control.setValue(newValue);
  }

  <input myDirective [(ngModel)]="value" name="value" >

這是一個粗略的描述，您可能想使其更詳細。