skip to content
Alvin Lucillo

Protected parent route

/ 1 min read

You can also set up the auth0 guard on a parent path. The same protection is applied to the listed children paths. This way, you don’t need to repeat canActivate multiple times.

In the example below, app.routes.ts sets auth0 guard on /account, /account/privacy, and /account/security

export const routes: Routes = [
	{
		path: "",
		component: Home,
	},
	{
		path: "profile",
		component: Profile,
		canActivate: [AuthGuard],
	},
	{
		path: "account",
		component: Account,
		canActivate: [AuthGuard],
		children: [
			{
				path: "",
				component: AccountSettings,
			},
			{
				path: "privacy",
				component: Privacy,
			},
			{
				path: "security",
				component: Security,
			},
		],
	},
];