CODEWITHSUNDEEP
javascriptangularjsangularjs-directiveangularjs-scope
maxedison
maxedison

Reputation: 17553

Bind built-in Angular directive to method in custom directive

I have a custom directive that needs to watch for a mousemove event on the element on which it is defined. Is it possible to use ng-mousemove in this case, but have the function passed to ng-mousemove refer to a method on my custom directive's scope. For example:

HTML

<div my-directive ng-mousemove="go()"></div>

Custom directive:

...
scope: true,
link: function(){
  $scope.go = function () { ... };
}

I realize I can create the event listener within my directive to watch for a mousemove event, but that seems to go against the standard Angular approach.

Upvotes: 0

Views: 88

Answers (1)

Estus Flask
Estus Flask

Reputation: 222498

Relying on arbitrary function from directive's scope doesn't look like 'totally encapsulated', more like the opposite of it. And btw, you can't do that anyway.

Standard Angular approach is something like this

app.directive('myDirective', function () {
  return {
    scope: true,
    transclude: true,
    template: '<div ng-transclude ng-mousemove="go()"></div>',
    link: function (scope){
      scope.go = function () { ... };
    }
  };
});

Upvotes: 1

Related Questions