Le hook ngOnInit dans Angular

Le hook ngOnInit se déclenche lors de l'initialisation du composant. Par son action, il ressemble au constructeur de la classe, mais on peut y exécuter des tâches plus complexes, comme, le chargement de données depuis un serveur.

Voyons comment utiliser ce hook. Pour commencer, il faut importer son interface :

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

Ensuite, il faut inclure l'interface dans la classe du composant :

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

}

Après cela, nous pourrons écrire dans la classe du composant la méthode ngOnInit et cette méthode s'exécutera automatiquement lors de l'initialisation de la classe. Vérifions son fonctionnement :

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