`canActivate`

Route guard that decides whether a route may be activated.

Since Angular 14.2+ Spec ↗

Syntax

canActivate: [CanActivateFn]

Parameters

Name	Type	Required	Description
`guard`	`CanActivateFn`	No	Function returning boolean, UrlTree, or an async of either.

Returns

boolean | UrlTree | Observable | Promise — Allows, blocks, or redirects navigation.

Examples

import { inject } from '@angular/core';
import { CanActivateFn, Router } from '@angular/router';
import { AuthService } from './auth.service';

export const authGuard: CanActivateFn = () => {
  const auth = inject(AuthService);
  const router = inject(Router);
  return auth.isLoggedIn() ? true : router.createUrlTree(['/login']);
};

// route: { path: 'admin', component: AdminComponent, canActivate: [authGuard] }

Notes

Modern guards are plain functions (CanActivateFn) that run in an injection context, so use inject() for dependencies. Return true to allow, false to block, or a UrlTree to redirect. Related guards include canActivateChild, canDeactivate, and canMatch.