Angularin ngOnInit-koukku

ngOnInit-koukku laukeaa komponentin alustuksen yhteydessä. Toiminnoltaan se muistuttaa luokan konstruktoria, mutta siinä voidaan suorittaa monimutkaisempia tehtäviä, kuten tietojen lataamista palvelimelta.

Katsotaan, kuinka tätä koukku käytetään. Aluksi sen rajapinta on tuotava:

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

Seuraavaksi rajapinta on lisättävä komponentin luokkaan:

app/user/user.component.tsexport class UserComponent implements OnInit {

}

Tämän jälkeen voimme kirjoittaa komponentin luokkaan metodin ngOnInit, ja tämä metodi suoritetaan automaattisesti luokan alustuksen yhteydessä. Tarkastetaan sen toiminta:

app/user/user.component.tsexport class UserComponent implements OnInit {
  constructor() {
    console.log('constructor is started');
  }
  ngOnInit() {
    console.log('onInit is applied');
  }
}