如何使用EventManager监听Angular中的window.resize事件?

Mat*_*ood 5 javascript dom-events observable rxjs angular

我从这个 stackoverflow 借用了一些代码:Angular window resize event 答案的作者说,如果我想监听来自服务的窗口事件而不破坏 Angular Universal,我应该使用EventManager 。话虽这么说,这个答案仍然正确吗?如果是这样,有人可以告诉我为什么当我订阅onResize$Observable 时,在调整窗口大小时没有记录任何内容吗?

import { EventManager } from '@angular/platform-browser';
import { Observable } from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';
import { Injectable } from '@angular/core';

@Injectable()
export class ResizeService {

  get onResize$(): Observable<Window> {
    return this.resizeSubject.asObservable().filter(_ => !_);
  }

  private resizeSubject: Subject<Window>;

  constructor(private eventManager: EventManager) {
    this.resizeSubject = new Subject();
    this.eventManager.addGlobalEventListener('window', 'resize', this.onResize.bind(this));
  }

  private onResize(event: UIEvent) {
    this.resizeSubject.next(<Window>event.target);
  }
}
Run Code Online (Sandbox Code Playgroud)

我的组件.ts

export class MenuContainer implements OnInit {

  constructor(private resizeService : ResizeService ) {
  }

  public ngOnInit() {
    this.resizeService.onResize$.subscribe(console.log); // never logs when I resize
  }
}
Run Code Online (Sandbox Code Playgroud)