简体   繁体   English

如何使用@HostListener传递window:scroll目标以触发Observable.fromEvent()订阅?

[英]How to pass window:scroll target using @HostListener to trigger an Observable.fromEvent() subscription?

I want to keep a similar syntax used in @HostListner and from that event create a stream using fromEvent() . 我想保留@HostListner使用的类似语法,并从该事件中使用fromEvent()创建流。 Currently scroll isn't triggering the fromEvent subscription. 当前滚动不会触发fromEvent订阅。

Question: How do I trigger var source = Observable.fromEvent(target, 'window:scroll'); 问题:如何触发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;
    }
}

我想应该是

var source = Observable.fromEvent(window, 'scroll');

我发现这很有用:

Observable.fromEvent(window, 'wheel')

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM