[[Angular Routing]] Guards are functions that first run to check whether the conditions match when navigating to or exit a route.
CanActivateuse CanActivateFn instead If condition istrue, allow to access this routeCanDeactivateuse CanDeactivateFn instead If condition istrue, allow to navigate to other route from current routeCanLoaduse CanMatchFn insteadCanMatchuse CanMatchFn instead If condition istrue, navigation continues. Iffalse, it will match other routes
Class based Route guards deprecation
Angular 16 prefer functional guards, all Route guards interface are now deprecated. Functional guards can be used directly in Route config
typescript
const routes: Route[] = [
{
path: 'first-component',
component: FirstComponent,
canActivate: [() => inject(myGuard).canActivate()]
}
];