Introduction

There is a bunch of cases when you need to listen to Router events in Angular applications, for example, to show navigation loaders or show user navigation errors.

Step 1: Inject Router

Firstly, we have to inject Router in the component which will listen for events.

Step 2: Subscribe on events

Then, we subscribe to Router events.

Step 3: Handle type of event

Router events stream fires all router events. That’s why we have to use instanceof to filter only required events for instance NavigationStart .

Shot

Here is the final shot:

Useful Links