2016-09-07 66 views
2

我想保留@HostListner中使用的類似語法,並使用fromEvent()來創建流。目前滾動不會觸發fromEvent訂閱。如何傳遞窗口:使用@HostListener滾動目標以觸發Observable.fromEvent()訂閱?

問題: 如何觸發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; 
    } 
} 

回答

4

我想這應該是

var source = Observable.fromEvent(window, 'scroll'); 
相關問題