Обзор хуков жизненного цикла компонентов

Директивы и экземпляры компонентов имеют жизненный цикл, который определяет, как Angular создает, обновляет и уничтожает их.

Каждый интерфейс имеет единственный метод подключения, именем которого является имя интерфейса с префиксом ng. Например, интерфейс OnInit имеет метод ловушки ngOnInit (), который Angular вызывает вскоре после создания компонента:

Код TypeScript:

export class PeekABoo implements OnInit {
  constructor(private logger: LoggerService) { }
  // implement OnInit's `ngOnInit` method
  ngOnInit() { this.logIt(`OnInit`); }
  logIt(msg: string) {
    this.logger.log(`#${nextId++} ${msg}`);
  }
}

Ни одна директива или компонент не будет реализовывать все хуки жизненного цикла. Angular вызывает только метод ловушки директивы / компонента, если он определен .

Последовательность жизненного цикла

После создания компонента / директивы путем вызова его конструктора Angular в определенные моменты вызывает методы ловушки жизненного цикла в следующей последовательности:

Другие угловые крючки жизненного цикла

Другие угловые подсистемы могут иметь свои собственные хуки жизненного цикла, кроме этих хуков компонентов.

Сторонние библиотеки могут также реализовывать свои хуки, чтобы дать разработчикам больший контроль над тем, как эти библиотеки используются.

Предыдущая: Взаимодействие компонентов
Далее: Стили компонентов