Support us .Net Basics C# SQL ASP.NET ADO.NET MVC Slides C# Programs Subscribe Buy DVD

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

If you like this website, please share with your friends on facebook and Google+ and recommend us on google using the g+1 button on the top right hand corner.