angular.js监听按键作为按钮的快捷方式

我的第一个角应用程序是一个非常基本的调查工具。 我有多个选择题,每个答案都有一个按钮,还有一个基本function,可以按下按钮点击每个答案,如下所示:

ng-click="logAnswer(answer.id)" 

我正在寻找的是能够在文档中添加一个按键事件,该事件将监听1,2,3,4,5的键盘响应,该响应与按钮选项匹配并调用相同的function。

在搜索时,我只能在特定输入字段具有焦点时找到与按键相关的响应,这对我没有帮助。 我确实在这篇文章中找到了OPs响应Angular.js按键事件和工厂似乎朝着正确的方向前进,但我无法弄清楚我如何得到他的指令来调用我的函数。

我在我的js中包含了该指令:

 angular.module('keypress', []).directive('keypressEvents', function($document, $rootScope) { return { restrict: 'A', link: function() { $document.bind('keypress', function(e) { $rootScope.$broadcast('keypress',e , String.fromCharCode(e.which)); }); } } }) 

但我不确定如何使用控制器中的键绑定对象:

 function keyedS(key, parent_evt, evt){ // key is the key that was pressed // parent_evt is the keypress event // evt is the focused element object } $scope.keyBindings = { 's': keyedS } 

如何让键绑定对象侦听我正在侦听的键并启动我需要的function?

谢谢

捕获控制器中的rootscope发出的事件:

 $rootScope.$on('keypress', function (e, a, key) { $scope.$apply(function () { $scope.key = key; }); }) 

然后你的key就可以在控制器中使用了。

这是一个小提琴

如果您坚持使用AngularJS来检测按键事件, ngKeypress就是您想要使用的。

     

您可以查看ngKeypress的文档以获取更多信息。 您可能还想查看ngKeydownngKeyup指令。

有人已经创建了一个特定的键盘快捷键AngularJS模块,看看:

https://github.com/chieffancypants/angular-hotkeys#angular-hotkeys-

特定按键/键控function

是否可以仅在按下特定键时调用函数,如空格键? 我看过ngKeydown

  

但这会在每个按键上调用该函数,是否可以看到按下了哪个键,可能在函数内?

使用ng-keydown指令公开的$event对象。

   

JS

  $scope.fn = function (event) { $scope.keyCode = event.keyCode; if (event.keyCode == 32) { console.log("spacebar pressed"); }; }); 

PLNKR上的DEMO

有关$event对象的更多信息,请参阅AngularJS Developer Guide – $ event

看一下ngKeyup指令。 ngKeyUp的描述

根据按键,使用一系列函数来完成所需的各种function