如何正确使用OnDestroy

时间:2019-02-01 06:53:31

标签: angular optimization memory-leaks ondestroy lifecycle-hook

我已经看到很多与ngOnDestroy有关的问题。我认为我们许多人没有正确使用它或根本没有使用它。
我只想查看提示列表,您将如何正确使用ngOnDestroy,以及在最佳情况下我们应该怎么做才能防止内存泄漏,加速和优化Web应用程序。
在每种情况下使用时都必须做什么?(必须采取哪些步骤?)
要完美完成,您需要走多远?取消所有引用等。

2 个答案:

答案 0 :(得分:2)

在组件的生命周期中,ngDestroy在组件实例最终被销毁之前被调用。这是清洁组件的理想场所

import {OnDestroy } from '@angular/core'; // import from core
@Directive({
   selector: '[destroyDirective]'
 })
export class OnDestroyDirective implements OnDestroy { // implements OnDestroy

  //Call Constructor and set hello Msg.
  constructor() {
     this.helloMsg = window.setInterval(() => alert('Hello, I am Anil'), 2000);
  }

  //Destroy to the component
  ngOnDestroy() { 
      window.clearInterval(this.helloMsg);
  }
}

答案 1 :(得分:2)

一种情况,您正在使用Observable并将其订阅到组件中,并获取数据流,即Firebase。您应该使用ngOnDestroy并在离开页面时取消订阅,以防止内存泄漏。

ngOnDestroy() {
  this.data.unsubscribe();
}