Preventing Navigation Away from a Route
Learn how to use guards to prevent navigation away from a route and prefetch route data to avoid flickering in the user interface.
We'll cover the following
Guards are used not only to prevent access to a route but also to prevent navigation away from it. A guard that controls if a route can be deactivated is a function of the CanDeactivateFn
type. We will learn how to use it by implementing a guard that notifies the user of pending products in the cart:
Create a file named
checkout.guard.ts
inside thesrc\app
folder.Add the following
import
statements at the top of the file:
Get hands-on with 1200+ tech skills courses.