The eight essential Angular lifecycle hooks
ngOnChanges
ngOnInit
ngDoCheck
ngAfterContentInit
ngAfterContentChecked
ngAfterViewInit
ngAfterViewChecked
ngOnDestroy
ngOnChanges
Every time an input property is changed, this hook is triggered.
ngOnInit
The ngOnInit lifecycle hook, called after the constructor, is the recommended place for initializing your component.
ngDoCheck
This hook runs constantly, during every change detection cycle, allowing for custom logic to detect changes.
ngAfterContentInit
After the component's content has been initialized, this lifecycle hook is executed. Any setup not yet completed for the component's content can be performed here.
ngAfterContentChecked
This hook comes after the component's content has been checked, at which point you can do more operations on it.
ngAfterViewInit
This hook fires when the component's view is ready, allowing you to interact with the view elements in your code.
ngAfterViewChecked
After the component's view has been checked, this lifecycle hook is executed, and is where further actions related to the component's view should be performed.
ngOnDestroy
The ngOnDestroy lifecycle hook fires just before the component is destroyed. It’s where you can clean up the component.