是否可以在简单服务而不是组件或指令中使用 Angular @HostListener('window:scroll',)

Question

是否可以在简单的服务而不是组件或指令代码中使用 Angular @HostListener('window:scroll',) ？

我不想污染我的任何组件，因为滚动的意识应该注入到其他几个服务中......目前我有以下可以编译的代码，但无法以某种方式工作。

import { Component, OnInit, Injectable, Inject, HostListener } from '@angular/core';
import { SearchService } from './search.service';
import { DOCUMENT } from '@angular/platform-browser';

const scrollStepToReload = 3700;

@Injectable()
export class ScrollWatcherService {

  private maxReachedScroll = 0;
  private lastLoadedAt = 0;

  constructor(private searchService: SearchService, @Inject(DOCUMENT) private document: any) { }

  @HostListener('window:scroll', ['$event'])
  onScroll($event) {

    const scrollOffset = window.pageYOffset || this.document.documentElement.scrollTop || this.document.body.scrollTop || 0;
    console.debug("Scroll Event", scrollOffset);

    if (scrollOffset > this.maxReachedScroll) {
      this.maxReachedScroll = scrollOffset;
    }
    if (this.lastLoadedAt + scrollStepToReload < this.maxReachedScroll) {

      this.lastLoadedAt = this.maxReachedScroll;
      this.searchService.continueSearch();

    }
  }
}

类似的代码可以根据需要在组件中工作。有什么想法如何让它在服务中运行吗？或者类似的东西？

Answer 1

服务中不能有 HostListener。使用经典：

window.addEventListener('scroll', () => { console.log('scrolling'); });