使用AngularUI獲取熱鍵

Question

我正在使用AngularUI keypress指令，但它給我帶來了問題。我能夠創建一個文本字段並附加一個按鍵事件（基本上它就是AngularUI頁面的演示內容）。

<textarea ui-keypress="{13:'keypressCallback($event)'}"> 

我想我的網頁上註冊的按鈕熱鍵，當我附上相同的用戶界面，按鍵事件的按鈕（或頁面的主體爲此事），它不工作。我怎樣才能讓我的熱鍵工作？

Answer 1

建立你的。 我做的方式是創建2個指令一個用於按鍵，一個用於按鍵

創建模塊（我稱之爲yourapp）後，您將創建您的指令。

yourapp.directive('keyPress', function() { 
    return function (scope, elm, attrs) { 
    elm.bind('keypress', function (e) { 
     var intKey = (window.Event) ? e.which : e.keyCode; 
     if (intKey === attrs.key) { 
     if (scope.theater === 1) { 
      scope.$apply(attrs.keyPress); 
     } 
     } 
    }); 
    }; 
}); 

yourapp.directive('keyUp', function() { 
    return function (scope, elm, attrs) { 
    elm.bind('keyup', function (e) { 
     var intKey = (window.Event) ? e.which : e.keyCode; 
     if (intKey === attrs.key) { 
     if (scope.theater === 1) { 
      scope.$apply(attrs.keyUp); 
     } 
     } 
    }); 
    }; 
}); 

這樣你就可以以這種方式使用它：

<div key-press="doSomething()" key="13"> // enter 
<div key-up="doSomething()" key="27"> // esc 

注意：這(window.Event) ? e.which : e.keyCode;將使其跨瀏覽器。