javascript - Unable to manipulate inherited scope in directive link (konami code directive implementation) -
edit: working plunker of directive (includes solution): http://embed.plnkr.co/uhfcva/
trying create directive enable debug mode listening keystrokes. reaches "debug mode toggle" message, understand use of scope object wrong. can't figure i've missed since "showdebug" variable made available in scope, it's not updated:
app.directive('bpkonamidebug', ['$document', '$rootscope', function($document, $rootscope) { // pattern = konami code (↑ ↑ ↓ ↓ ← → ← → b a) var pattern = [38, 38, 40, 40, 37, 39, 37, 39, 66, 65]; // pattern = "debug" // var pattern = [100, 101, 98, 117, 103]; // keycodes "debug" var cursor = 0; return { restrict: 'a', link: function(scope, element, attrs) { // enrich parent scope // stackoverflow: variable set (works) scope.showdebug = true; // bind document's keydown event (rem: keypress trapped navigation handler, pans screen , disables propagation) $document.bind('keydown', function(event) { // obtain keycode var keycode = event.which; // compare keycode expected character if(pattern[cursor] == keycode){ // end of pattern? if(pattern.length == ++cursor){ console.log('debug mode toggle'); // stackoverflow: fail change value scope.showdebug = !scope.showdebug; cursor = 0; } } else{ cursor = 0; } }); } }; } ]);
thanks time
ok, found logic in "link" executed directive attached dom.
read answer explanation: angularjs: need of directive's link function when had directive's controller scope?
in case, event seems need scope.$apply() call.
Comments
Post a Comment