javascript - Angular 组件每 X 秒刷新一次页面数据

Question

我需要每 30 秒刷新一次 Angular 组件的数据。我使用简单的 setInterval:

 this.interval = setInterval(() => {
               this.refresh(); // api call
            }, 10000);

但是，这是不正确的，因为即使我导航到另一个“页面”(在 Angular SPA 中，所有内容都是一个页面，所以它不是真正的另一个页面)，每 30 秒刷新一次。

仅在特定页面/组件上每 30 秒刷新一次数据的正确方法是什么？

Answer 1

您可以在组件的 OnDestroy 生命周期钩子(Hook)上销毁 interval。

使用 clearInterval(this.interval)

ngOnDestroy() {
   if (this.interval) {
     clearInterval(this.interval);
   }
}