I want to keep a similar syntax used in @HostListner
and from that event create a stream using fromEvent()
. Currently scroll isn't triggering the fromEvent
subscription.
Question:
How do I trigger var source = Observable.fromEvent(target, 'window:scroll');
?
import { Directive, HostListener } from '@angular/core';
import {Observable} from "rxjs";
import 'rxjs/add/observable/fromEvent';
@Directive({
selector: '[mh-scroll]'
})
export class MhScroll {
lastKnownScrollPosition: number;
ticking: boolean;
constructor() {
this.lastKnownScrollPosition = 0;
this.ticking = false;
}
isElementCloseToTop(target) {
var source = Observable.fromEvent(target, 'window:scroll'); //this never triggers.
var subscription = source.subscribe(
(x) => {
console.log('Next: Clicked!');
},
(err) => {
console.log('Error: %s', err);
},
() => {
console.log('Completed');
});
this.ticking = false;
}
@HostListener('window:scroll', ['$event.target'])
triggeredScroll(target) {
this.lastKnownScrollPosition = window.scrollY;
if (!this.ticking) {
window.requestAnimationFrame(this.isElementCloseToTop.bind(this, target));
}
this.ticking = true;
}
}