angularjs - How to get directive to apply focus to its wrapped input? -


i've built attribute directive (focus-on-event) watches event on $rootscope , when it's triggered sets focus onto attached element.

the problem when want add directive custom directive wrapping input (wrapped-input). need go element , apply focus input.

i tried binding focus event of wrapped-input, never seems triggered. tried broadcasting event doesn't seem work. if can make either approach work, can put focus on wrapped input element right wrapped-input's link function.

how can make work?

angular    .module('app', [])        .directive('wrappedinput', function() {      return {        template: '<input placeholder="wrapped input">',        link: function(scope, element, attrs) {          scope.$on('hello', function() {            alert('this never gets called');          });          element.bind('focus', function() {            alert('this never gets called either');          });        }      }    })        .directive('clicktriggers', function($rootscope) {      return {        scope: { clicktriggers: '@' },        link: function(scope, element, attrs) {          element.bind('click', function() {            $rootscope.$broadcast(scope.clicktriggers);          });        }      }    })        .directive('focusonevent', function() {      return {        scope: { focusonevent: '@' },        link: function(scope, element, attrs) {          scope.$on(scope.focusonevent, function(onevent, keypressevent) {            element[0].focus();            scope.$broadcast('hello');          });        }      }    });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.js"></script>    <div ng-app="app">    <div>      <wrapped-input focus-on-event="event1"></wrapped-input>      <button click-triggers="event1">trigger 'event1'</button>    </div>      <div>      <input type="text" focus-on-event="event2" placeholder="native input">      <button click-triggers="event2">trigger 'event2'</button>    </div>  </div>

options:

  1. broadcast rootscope.

  2. broadcast parentscope

  3. emit directive , have parent scope controller catch , broadcast it.


Comments

Popular posts from this blog

Java 3D LWJGL collision -

methods - python can't use function in submodule -

c# - ErrorThe type or namespace name 'AxWMPLib' could not be found (are you missing a using directive or an assembly reference?) -