Composants et cycle de vie
Component lifecycle hooks, ngOnInit, ngOnChanges, ngOnDestroy, ngAfterViewInit, component communication, @Input, @Output
1Qu'est-ce qu'un lifecycle hook dans Angular ?
Qu'est-ce qu'un lifecycle hook dans Angular ?
Réponse
Un lifecycle hook est une méthode spéciale appelée automatiquement par Angular à des moments clés du cycle de vie d'un component ou d'une directive. Ces hooks permettent d'exécuter du code à des étapes précises comme la création, la mise à jour ou la destruction. Les hooks les plus courants sont ngOnInit, ngOnChanges et ngOnDestroy.
2À quel moment ngOnInit est-il appelé ?
À quel moment ngOnInit est-il appelé ?
Réponse
ngOnInit est appelé une seule fois après le premier ngOnChanges, une fois que toutes les propriétés @Input ont été initialisées. C'est le hook idéal pour initialiser les données du component, démarrer des subscriptions ou appeler des services. Il est préférable à constructor pour la logique d'initialisation car toutes les bindings sont garantis disponibles.
3Quelle est la différence principale entre ngOnChanges et ngOnInit ?
Quelle est la différence principale entre ngOnChanges et ngOnInit ?
Réponse
ngOnChanges est appelé à chaque fois qu'une propriété @Input change de valeur et reçoit un objet SimpleChanges contenant les anciennes et nouvelles valeurs. ngOnInit est appelé une seule fois après la première initialisation. Utiliser ngOnChanges pour réagir aux changements d'inputs et implémenter une logique dépendante des valeurs @Input. Privilégier ngOnInit pour l'initialisation unique comme les appels API ou la configuration initiale.
Pourquoi utiliser ngOnDestroy dans un component ?
Dans quel ordre sont appelés les lifecycle hooks lors de la création d'un component ?
+17 questions d'entretien
Autres sujets d'entretien Angular
Les bases de TypeScript
TypeScript avancé
Fondamentaux Angular
Services et Dependency Injection
Organisation des Modules Angular
Angular CLI
Directives et Pipes
Routing et Navigation
Formulaires réactifs
Formulaires template-driven
Fondamentaux RxJS
Opérateurs RxJS
HttpClient et API calls
Gestion d'état de base
Change Detection
Angular Signals
Standalone Components
Tests unitaires Angular
Tests end-to-end
Build et optimisation
Fondamentaux NgRx
NgRx avancé
Architecture Angular
Optimisation de performance
Sécurité et bonnes pratiques
Patterns RxJS avancés
Angular Universal et SSR
Micro-frontends Angular
Maîtrise Angular pour ton prochain entretien
Accède à toutes les questions, flashcards, tests techniques, exercices de code review et simulateurs d'entretien.
Commencer gratuitement