Angular Equivalent of jQuery MouseWheel

Question

Does anyone know what the angular equivalent of mousewheel is?

I basically need to be able to do the following in Angular but can't find much information about it

$(document).bind('mousewheel', function(e) {...

The website I am working on has overflow: hidden on it, which means there is no scrollbar and window scrolling won't work. I just need to be able to detect a scroll event to fire a function. Onscroll only works when the scrollbar actually moves

Thanks for the help

Possible duplicate of [Tracking scroll position and notifying other components about it (Angular2)](http://stackoverflow.com/questions/36468318/tracking-scroll-position-and-notifying-other-components-about-it-angular2) — Maximilian Riegler, Oct 27 '16 at 15:38

score 1 · Accepted Answer · answered Oct 27 '16 at 16:12

1

@Directive({
    selector: '[wheel]'
})
class WheelDirective {

 @HostListener('wheel', ['$event']) 
  Wheel(event) {
   console.log('wheel');
  }
}

<div wheel class="wheel">..long text</div>

.wheel {
  max-height: 300px;
  overflow: scroll;
}

answered Oct 27 '16 at 16:12

Bazinga

10,716
6
38
63

1

What a ridiculous syntax. Google needs to stop the madness. – M H Aug 24 '17 at 22:10

Angular Equivalent of jQuery MouseWheel

1 Answers1