Angular'da ngOnDestroy Kancası

ngOnDestroy kancası, bileşen kaldırıldığında tetiklenir. Bu kancada kaynakları serbest bırakabilir, eleman olaylarına olan abonelikleri silebilir, zamanlayıcıları temizleyebilirsiniz vb.

Angular'da bir bileşenin oluşturulması ve kaldırılması, if koşulu ile reaktif bir şekilde gösterilip gizlendiğinde gerçekleşir. Yani Angular bileşenleri sadece gizlemez, onları kaldırır ve geri getirir.

Ayrıca, bileşenler döngüler içinde reaktif olarak tekrarlandığında da oluşturulur ve kaldırılır. Bu durumda da Angular bileşenleri oluşturur ve kaldırır.

Pratikte deneyelim. OnDestroy arayüzünü içe aktaralım:

app/user/user.component.tsimport { OnDestroy } from '@angular/core';

Onu sınıfa bağlayalım:

app/user/user.component.tsexport class UserComponent implements OnDestroy {
  
}

Şimdi kancamızı yazalım:

app/user/user.component.tsexport class UserComponent implements OnDestroy {
  constructor() {
    console.log('constructor is started');
  }
  
  ngOnDestroy() {
    console.log('onDestroy is applied');
  }
}