Learn TypeScript 3 by Building Web Applications

Component life cycle hooks

In the section about components, we briefly mentioned life cycle hooks. Angular really makes it easy to plug in logic at different points in the life cycle of your applications/components (for example, when a component is created, rendered, or when it renders its children).

Using life cycle hooks is a breeze. All you need to do is implement the interface of the hook that you want to attach logic to.

Here's an example:

export class SomeComponent implements OnInit { 
  constructor() { } 
 
  // implement OnInit's method
  ngOnInit() { 
    console.log('SomeComponent was just initialized'); 
  } 
} 

Here, we have used the OnInit life cycle hook, which requires us to implement the ngOnInit method. That method will be called each time ...