Angular 9 取消订阅 NavigationEnd

Question

我在路由器 NavigationEnd 上使用订阅，如下所示:

this.router.events
  .subscribe((event) => {
    if (event instanceof NavigationEnd) {
      this.getData();
    }
  });

当我在同一 route 导航时，例如，我需要它来更新页面数据。/product1 和/product2 使用相同的组件和路由，并在自定义路由服务中处理

这是为了在同一组件中的路由更新时获取数据，并且它按预期工作

问题是 this.getData() 在导航到另一个组件时也会运行，这在我导航到的组件中产生了很多问题，而且我还从服务器运行了不必要的获取

所以问题是:当我离开组件时可以取消订阅路由器，这样 this.getData() 就不会运行吗？

Answer 1

您可以在Observables中使用订阅

首先在您的组件上进行初始化

navigationSubs = new Subscription();


this.navigationSubs = this.router.events
  .subscribe((event) => {
    if (event instanceof NavigationEnd) {
      this.getData();
    }
  });

销毁时或任何您想要的时候

this.navigationSubs.unsubscribe();