Angular ngOnDestroy Hooks

Hooks ngOnDestroy tiek izsaukts, kad komponents tiek noņemts. Šajā hook var atbrīvot resursus, noņemt notikumu abonementus, apturēt taimerus utt.

Komponenta izveide un noņemšana Angular notiek, kad tas reaktīvi tiek rādīts un paslēpts, izmantojot if nosacījumu. Tas nozīmē, ka Angular ne vienkārši paslēpj komponentus, bet tos noņem un pēc tam atgriež atpakaļ.

Arī komponenti tiek izveidoti un noņemti, kad tie tiek iterēti ciklos reaktīvi. Šajā gadījumā Angular arī izveido un noņem komponentus.

Izmēģināsim to praksē. Importēsim interfeisu OnDestroy:

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

Pievienosim to klasei:

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

Un tagad uzrakstīsim mūsu hook:

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