Компоненти та життєвий цикл
Component lifecycle hooks, ngOnInit, ngOnChanges, ngOnDestroy, ngAfterViewInit, component communication, @Input, @Output
1Що таке lifecycle hook в Angular?
Що таке lifecycle hook в Angular?
Відповідь
Lifecycle hook — це спеціальний метод, який автоматично викликається Angular у ключові моменти життєвого циклу компонента або директиви. Ці хуки дозволяють виконувати код на певних етапах, таких як створення, оновлення або знищення. Найпоширеніші хуки — це ngOnInit, ngOnChanges та ngOnDestroy.
2Коли викликається ngOnInit?
Коли викликається ngOnInit?
Відповідь
ngOnInit викликається один раз після першого ngOnChanges, коли всі властивості @Input ініціалізовані. Це ідеальний хук для ініціалізації даних компонента, запуску підписок або виклику сервісів. Він кращий за constructor для логіки ініціалізації, оскільки всі прив'язки гарантовано доступні.
3Яка основна різниця між ngOnChanges та ngOnInit?
Яка основна різниця між ngOnChanges та ngOnInit?
Відповідь
ngOnChanges викликається кожного разу, коли значення властивості @Input змінюється, і отримує об'єкт SimpleChanges, що містить старі та нові значення. ngOnInit викликається лише один раз після першої ініціалізації. Використовуйте ngOnChanges, щоб реагувати на зміни вхідних даних та реалізовувати логіку, що залежить від значень @Input. Надавайте перевагу ngOnInit для одноразової ініціалізації, такої як виклики API або початкова конфігурація.
Чому використовувати ngOnDestroy у компоненті?
У якому порядку викликаються lifecycle hooks при створенні компонента?
+17 питань зі співбесід
Інші теми співбесід Angular
Основи TypeScript
TypeScript просунутий
Основи Angular
Services & Dependency Injection
Організація модулів Angular
Angular CLI
Директиви та Pipe
Маршрутизація та навігація
Реактивні форми
Template-driven форми
Основи RxJS
Оператори RxJS
HttpClient і виклики API
Базове керування станом
Change Detection
Angular Signals
Standalone Components
Модульні тести в Angular
End-to-End тестування
Build і оптимізація
Основи NgRx
Просунутий NgRx
Архітектура Angular
Оптимізація продуктивності
Безпека та найкращі практики
Просунуті патерни RxJS
Angular Universal та SSR
Angular Micro-frontends
Опануй Angular для наступної співбесіди
Отримай доступ до всіх питань, flashcards, технічних тестів, вправ code review та симуляторів співбесід.
Почни безкоштовно