AngularJS - 在同一時間多個按鍵

Question

我有以下$broadcast趕上按鍵在角：

$document.bind('keypress', function(event) { 
    var key = event.which; 
    $rootScope.$broadcast('keypress', event); 
    $rootScope.$broadcast('keypress:' + key, event); 
}); 

和我一起$on

聽不過，我想當按下兩個鍵來檢測同時按enter和s同時按下（不是一個組合後跟另一個組合）。

這樣做的最好方法是什麼？

編輯

我想是有：

var keys = []; 
$document.bind('keydown', function(event) { 
    keys[event.which] = true; 
}); 
$document.bind('keyup', function(event) { 
    delete keys[event.which]; 
}); 

$document.bind('keypress', function(event) { 
    var key = event.which; 
    var keysPressed = []; 
    angular.forEach(keys, function(value, key) { 
     keysPressed += 'keypress:' + key; 
    }); 
    $rootScope.$broadcast('keypress', event); 
    $rootScope.$broadcast(keysPressed, event); 
}); 

所以，如果我有多個按鍵，然後創建正確的$broadcast。然而問題，成爲該訂單現在最重要的（即，如果我按a然後enter，則$broadcast是keypress:58keypress:13，如果我按另一種方式，我得到keypress:13keypress:58）

Answer 1

Boradcast使用辦法不多在我看來。相反，也許用它作爲指令？這是用戶的一個例子按下Shift + Tab鍵，它觸發一個事件，像這樣：

<input ng-shift-tab="prevStep('email')" /> 

app.directive('ngShiftTab', function() { 
return function(scope, element, attrs) { 
    var map = {9: false, 16: false}; 

    element.bind("keydown", function(event) { 
     if (event.which in map) { 
      map[event.which] = true; 
      if (map[9] && map[16]) { 
       scope.$apply(function(){ 
        scope.$eval(attrs.ngShiftTab, {'event': event}); 
       }); 
       event.preventDefault(); 
      } 
     } 
    }); 
    element.bind("keyup", function(event) { 
     if (event.which in map) { 
      map[event.keyCode] = false; 
     } 
    }); 
}; 
}) 

Answer 2

對於修飾鍵（Ctrl，Alt， Shift）更簡單，因爲有event.ctrlKey, event.altKey, event.shiftKey。但對於沒有組合鍵，你應該使用這樣的問題Detect multiple keys on single keypress event in jQuery：

var map = {68: false, 69: false, 86: false}; 

$(document).keydown(function(e) { 
    if (e.keyCode in map) { 
     map[e.keyCode] = true; 
     if (map[68] && map[69] && map[86]) { 
      // FIRE EVENT 
     } 
    } 
}).keyup(function(e) { 
    if (e.keyCode in map) { 
     map[e.keyCode] = false; 
    } 
}); 

Answer 3

在這個問題上的jQuery答案解決這個問題很有效，這裏有一些角的具體方法：

• How to watch for a keypress combination in Angularjs?

從那次討論中得知，當連續按下兩次時觸發一個事件：

• http://plnkr.co/edit/t016cWzbH3D37m2bAU4Y

上面的例子是能夠實現作爲jQuery的答案相同的效果，但僅使用一個keyup事件偵聽器，而不是一個KEYUP和KEYDOWN。同時還具有良好的使用$廣播觸發事件的另一個$：

var upHitOnce = false; 

$(document).keyup(function(event) { 
    if (event.which == 38) { 
     if (upHitOnce) { 
     $rootScope.$broadcast('DoubleUpFired'); 
     $rootScope.$apply(); 
     upHitOnce = false; 
     } else { 
     upHitOnce = true; 
     } 
    } else { 
     upHitOnce = false; 
    } 
    }); 

檢測同時按鍵如ctrl+r是一個涉及多一點;下面是對如何做到這一點的角度例子的jsfiddle：

• http://jsfiddle.net/firehist/nzUBg/

Answer 4

沒有爲AngularJS，做拍攝的正是那種，是很簡單的使用一個模塊：angularHotkeys

這是您的控制器內部產生的代碼示例：

hotkeys.add({ 
    combo: 'return+s', 
    description: 'Shortcut description...', 
    callback: function() { 
    // your code here 
    } 
});