Arik  Donowan Arik Donowan - 1 year ago 132
Javascript Question

How to bind scroll event on element in Angular directive

How can I bind scroll event on element in Angular directive ?

I bind scroll on $window, but now i need to change it to this class ".body-wrapper" (angular.element(document.queryselector(.body-wrapper)) doesn't work) .

Any ideas ?

angular.element($window).bind("scroll", function () {
...
})

Answer Source

No reason it shouldn't work.

This simple example shows it does-

var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
  angular.element(document.querySelector('.myDiv')).bind('scroll', function(){
      alert('scrolling is cool!');
    })
});

Plunker example

if for some reason it is not working, post full code.

Edit after discussion:

Eventually the problem is with the specific event for "scroll", it probably collides with another event.

Changing the event to "mousewheel" did the trick.

Working fiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download