Component lifecycle hooks

The life of an Angular component is eventful. Components get created, change state during their lifetime, and finally, they are destroyed. Angular provides some lifecycle hooks/functions that the framework invokes (on the component) when such an event occurs. Consider these examples:

  • When a component is initialized, Angular invokes ngOnInit
  • When a component's data-bound properties change, Angular invokes ngOnChanges
  • When a component is destroyed, Angular invokes ngOnDestroy

As developers, we can tap into these key moments and perform some custom logic inside the respective component.

The hook we are going to utilize here is ngOnInit. The ngOnInit function gets fired the first time the component's data-bound properties ...

Get Building Large-Scale Web Applications with Angular now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.