2017-01-22 14 views
0

「D」キーが押されたかどうかを確認するためにキーボードを聴く必要のあるコンポーネントで、Angular2でWebアプリケーションを開発しています。これは、他のコンポーネントにあるHTML <input>に入力するのを妨げることを除いて、うまく動作します。私はそれがキーボードリスナクラスのいくつかのコードによって引き起こされたと推測していますが、私はどこにいるのか分かりません。TypescriptキーボードリスナーはHTML入力フォームに入力できないようにします

export class Keyboard { 

    private keyboard_d; 

    constructor(){ 
     this.keyboard_d = Keyboard.keyboard(68); 
    } 

    static keyboard(keyCode){ 
     var key = { 
      code: keyCode, 
      isDown: false, 
      isUp: true, 
      press: undefined, 
      release: undefined, 
      downHandler: function(event){ 
       if (event.keyCode === key.code) { 
        if (key.isUp && key.press) key.press(); 
        key.isDown = true; 
        key.isUp = false; 
       } 
       event.preventDefault(); 
      }, 
      upHandler: function(event) { 
       if (event.keyCode === key.code) { 
        if (key.isDown && key.release) key.release(); 
         key.isDown = false; 
         key.isUp = true; 
        } 
        event.preventDefault(); 
       } 
      } 

     //Attach event listeners... 
     window.addEventListener(
      "keydown", key.downHandler.bind(key), false 
     ); 
     window.addEventListener(
      "keyup", key.upHandler.bind(key), false 
     ); 
     return key; 
    } 

    //Returns true if the D key is pressed down, false if it is not. 
    public isDpressed(){ 
     return this.keyboard_d.isDown; 
    } 
} 

このクラスは、このようなAngular2コンポーネントで使用されています:このコードでは、HTMLの中に入力してから私を妨げている

var keyboard_listener = new Keyboard(); //create 
var dPressed : boolean = keyboard_listener.isDPressed(); 

ここ

は、その中に、リスナークラスが全体だです入力フォーム?

注意私は、必要がない場合はangular2タグを追加したくないので、2つの関連するコンポーネントの角度コードを意図的に省略しました。私の直感は、上記のコードが問題だと言います。しかし、必要と思われる場合は、投稿を編集して角度コードとタグを追加します。

+0

イベントハンドラのデフォルトコードを削除しようとしましたか? – toskv

+0

これは修正されました!ありがとうございました!あなたが好きなら、あなたは適切な回答を投稿するかもしれません。私はそれを受け入れたものとしてマークします。 – JavascriptLoser

答えて

1

event.preventDefaultの呼び出しは、そのイベントのデフォルトの動作を停止し、その結果、文字は入力フィールドに表示されません。

関連する問題