angularjs - Implementing keyboard shortcuts in Angular apps -
i using directive implement keyboard shortcuts in angular app. directive called "keycapture". included in body tag of index page.
<body ng-controller="mainctrl" key-capture> this directive uses mix of $broadcast , other methods things done.
angular.module('plunker').directive('keycapture',['$state','$rootscope',function($state, $rootscope){ var shortcutkeys = []; return { link: function(scope,element,attrs,controller){ element.on('keydown',function(e){ shortcutkeys.push(e.keycode); if (shortcutkeys.length === 2){ var key2 = shortcutkeys.pop(); var key1 = shortcutkeys.pop(); /*press g , 1 - navigate different state*/ if (key1 === 71 && key2 == 49) { $state.transitionto('option1'); } /*press g , 2 - navigate different state*/ if (key1 === 71 && key2 == 50) { $state.transitionto('option2'); } /*press g , 3 - call function */ if (key1 === 71 && key2 == 51) { $rootscope.$broadcast('option1-event1') } /*press g , 4 - call function*/ if (key1 === 71 && key2 == 52) { $rootscope.$broadcast('option1-event2') } } }) } }; }]); the plnkr available here: http://plnkr.co/yqs3o3wgoie00tpozclp
i skeptical if right way implement keyboard shortcuts app. has better idea of how integrate keyboard shortcuts app.. kindly comment .. or event better.. explain code sample.
thanks
have checked out angular hotkeys ? brad green project manager of angular has mentioned how awesome few times. better implementing unless you're trying learn.
Comments
Post a Comment