Support us .Net Basics C# SQL ASP.NET Aarvi MVC Slides C# Programs Subscribe Download

Angular router navigation events

Suggested Videos
Part 52 - Angular read query string parameters | Text | Slides
Part 53 - Create observable from array | Text | Slides
Part 54 - Angular resolve guard | Text | Slides

In this video we will discuss the sequence of navigation events that are triggered by the angular router, when navigating from one route to another route. These navigation events range from when the navigation starts and ends to many points in between.


To see these navigation events in action, set enableTracing option to true as shown below. Enabling tracing logs all the router navigation events to the browser console.

RouterModule.forRoot(appRoutes, { enableTracing: true })


The following list shows some of the navigation events
  • NavigationStart
  • NavigationEnd
  • RoutesRecognized
  • GuardsCheckStart
  • GuardsCheckEnd
  • NavigationCancel
  • NavigationError
  • ChildActivationStart
  • ChildActivationEnd
  • ActivationStart
  • ActivationEnd
  • ResolveStart
  • ResolveEnd
What are the use cases of these navigation events
  • Monitor routes 
  • Troubleshoot when routing does not work as expected
  • Display a loading message if there is a delay when navigating from one route to another (We will discuss this in our next video)
angular crud tutorial

No comments:

Post a Comment

It would be great if you can help share these free resources