Що таке життєвий цикл компонента в Angular?

В Angular життєвий цикл компонента - це послідовність етапів від створення компонента до його знищення, під час яких Angular викликає спеціальні методи життєвого циклу (lifecycle hooks) для керування станом і ресурсами.

#Основні моменти

1. Створення компонента

• Angular створює екземпляр класу компонента і впроваджує залежності через конструктор (constructor).
• На цьому етапі ще немає доступу до DOM-елементів шаблону.

2. Ініціалізація (OnInit)

• Метод ngOnInit() викликається після прив'язки вхідних даних (@Input) і підготовки шаблону.
• Використовується для ініціалізації логіки, завантаження даних і налаштування початкового стану.

3. Оновлення (OnChanges, DoCheck, AfterViewInit)

• ngOnChanges(changes) - викликається при зміні вхідних даних (@Input).
• ngDoCheck() - кастомна перевірка змін, якщо потрібна точніша реакція на зміни.
• ngAfterViewInit() - викликається після ініціалізації дочірніх компонентів і елементів DOM.

4. Оновлення представлення

• ngAfterViewChecked() - викликається після кожної перевірки змін у компоненті та його дочірніх компонентах.

5. Знищення (OnDestroy)

• Метод ngOnDestroy() викликається перед видаленням компонента з DOM.
• Використовується для очищення ресурсів, відписки від підписок, таймерів, подій.

Іншими словами, життєвий цикл компонента - це контрольований Angular процес створення, оновлення та знищення компонента, який дозволяє керувати логікою і ресурсами на кожному етапі.