Hook ngOnDestroy u Angularu

Hook ngOnDestroy aktivira se prilikom uklanjanja komponente. U ovom hook-u možete osloboditi resurse, ukloniti pretplatu na događaje elemenata, zaustaviti tajmere i sl.

Kreiranje i uklanjanje komponente u Angularu dogadja se kada se ona reaktivno prikazuje i skriva pomoću uslova if. To znači da Angular ne samo da skriva komponente, već ih uklanja i vraća nazad.

Takođe, komponente se kreiraju i uklanjaju, kada se reaktivno iteriraju u petljama. U ovom slučaju Angular takođe kreira i uklanja komponente.

Hajde da probamo u praksi. Importujmo interfejs OnDestroy:

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

Povežimo ga sa klasom:

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

A sada napišimo naš hook:

app/user/user.component.tsexport class UserComponent implements OnDestroy {
  constructor() {
    console.log('constructor je pokrenut');
  }
  
  ngOnDestroy() {
    console.log('onDestroy je primenjen');
  }
}