Skip to main content

Які є хуки і в якому порядку вони викликаються?

AngularJunior~1 хв читання
Запропонувати правку

В Angular хуки життєвого циклу викликаються у строго визначеному порядку. Повна послідовність для компонента виглядає так:

Повна послідовність

  1. ngOnChanges(changes) - викликається вперше, коли Angular встановлює значення вхідних властивостей (@Input). Викликається щоразу, коли вхідні властивості змінюються.
  2. ngOnInit() - один раз після першої ініціалізації вхідних властивостей.
  3. ngDoCheck() - після ngOnInit і на кожному циклі виявлення змін (change detection).
  4. ngAfterContentInit() - після вставки вмісту батька через <ng-content>.
  5. ngAfterContentChecked() - після кожної перевірки вставленого вмісту.
  6. ngAfterViewInit() - після ініціалізації шаблону компонента і всіх дочірніх компонентів.
  7. ngAfterViewChecked() - після кожної перевірки view компонента.
  8. ngOnDestroy() - перед знищенням компонента, для очищення ресурсів.

Схематично:

javascript
ngOnChanges → ngOnInit → ngDoCheck → ngAfterContentInit → ngAfterContentChecked → ngAfterViewInit → ngAfterViewChecked → (повторно ngDoCheck/ngAfterContentChecked/ngAfterViewChecked при оновленнях) → ngOnDestroy

Висновок: послідовність відображає життєвий цикл компонента від створення до знищення, включно з обробкою вхідних даних, вмісту та view.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

Запропонувати правку