Хук ngOnInit в Angular

Хук ngOnInit се задейства при инициализация на компонента. По действие той прилича на конструктора на класа, но в него може да се изпълняват по-сложни задачи, например, зареждане на данни от сървъра.

Нека да видим как да използваме този хук. Първо трябва да импортираме неговия интерфейс:

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

След това трябва да включите интерфейса в класа на компонента:

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

}

След това можем да напишем в класа на компонента метод ngOnInit и този метод ще се изпълни автоматично при инициализация на класа. Нека проверим неговата работа:

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