Angular Life Cycle Hook | ngOnInit vs constructor| Component Life Cycle Hooks (Part-1) (Tutorial 41)

Hello Everyone
This video will cover about Life Cycle hooks in Angular and its type.
I have covered about constructor and ngOnInit in detail in this video

Support my channel by like, share and subscribe so that I can reach to wider audience and can help them :) :)

We have worked with Components and Directives in Angular quite a lot now. And if you are new to Components or directives, refer here. When dealing with components or directives, there is a sequence of steps that are performed to build an angular application from its initialization to its destruction.

The lifecycle of a component/directive is managed by Angular as it creates, checks, updates, renders, and destroys.


To have a view of all these occurrences and respond to these moments, Angular provides lifecycle hooks which give us visibility into these.
Life cycle hooks in simple way we can say, that it is nothing but simple functions that a developer can call during a specific point of the life of a component in their Angular application.

There are 8 distinct kinds of hooks in the lifecycle of a component or directive.

1)ngOnChanges
2)ngOnInit
3)ngDoCheck
4)ngAfterContentInit
5)ngAfterContentChecked
6)ngAfterViewInit
7)ngAfterViewChecked
8)ngOnDestroy

Constructor:


A constructor is a special method that will be called whenever we create new objects. It is a feature of the class(typescript) itself, an object-oriented design concept. A constructor is also used to initialise the class members.

When we talk about angular components, constructor we use to inject dependencies. Angular always executes the constructor method first then all lifecycle hooks will come into the picture


ngOnInit: This lifecycle hook is the most usable hook as we can initialise all methods and variables here in it. When we need to initialise any method where we can have the logic of getting initial data for a component then we can use ngOnInit() to call that method. This lifecycle hook will implement after all data bound properties to get called so we will have all properties to use initially. Basically, this lifecycle hook will call once and after ngOnChanges() called


Checkout other important topics :
RxJS Subject:    • RxJS Subject | What is RxJs Subject  ...  
RxJS BehaviorSubject :    • BehaviorSubject | BehaviorSubject vs ...  
RxJS Replay Subject:    • ReplaySubject | ReplaySubject vs Beha...  
Angular Subject and BehaviorSubjet:    • Subject and BehaviorSubject | Compone...  
Promises vs Observables:    • Promises vs Observables - Angular (Tu...  
Promises vs Observables shorts:    • Promise vs Observable | Difference be...  

#angular #angularTutorial #nishasingla