AngularJS: How to remove event handlers from an element that were added by a directive?

Question

I have an attribute directive that adds event listeners for certain events on an element in the link() function via element.addEventListener(<event>, handler);

Eventually, I wish to dynamically remove those handlers based on logic in my controller. How can I do this? I considered just calling removeEventListener on the element in my controller, but I don't have a reference to the handler function since it's in my directive.

Answer 1

You can use to remove event handlers in the end.

scope.$on('$destroy', function() {
      //Code to remove Event     
});

And if you want to remove it in between then you can listen for an event inside directive and broadcast or emit from controller when you want.