How does angular actually trigger lifecycle hooks?
in the life cycle , we have different interfaces that track different stages of the component. life cycle, for example. OnInit, OnChanges, OnDestroy..etc
at runtime angular runs these methods?
for ex. ngOnChanges () is triggered when data changes @Input
angular now has this logic I assume
1- whenever angular detects changes in data @input
2- angular check if this component class implements OnChanges 3, if true then trigger ngOnChanges ()
and there is some logic for each of the lifecycle hooks
- is this the way angular does the lifecycle hooks?
source to share
Great question! Angular lifecycle hooks are implemented by the library [ source ]. @angular/core
To prove it, run the project angular cli
and in tools (optional chrome) dev, place a line break inside life like so:
Refresh the page to catch the breakpoint and thus view the call stack:
The Angular team is explicitly writing verbal code, so I don't think I need to explain the logic behind the following statement that calls ngOnInit()
:
if ((view.state & ViewState.FirstCheck) && (def.flags & NodeFlags.OnInit)) {
directive.ngOnInit();
}
A nice typescript version of this function can be found here .
source to share
