Difference between Angular's canLoad and canActivate?

Question

What is the difference between canLoad and canActivate?

export interface Route {
  path?: string;
  pathMatch?: string;
  matcher?:         


        

Answer 1

canActivate is used to prevent unauthorized users from accessing certain routes. See docs for more info.

canLoad is used to prevent the application from loading entire modules lazily if the user is not authorized to do so.

See docs and example below for more info.

{
    path: 'admin',
    loadChildren: 'app/admin/admin.module#AdminModule',
    canLoad: [AuthGuard]
},

With this code, the code for the AdminModule will only be loaded into the application if AuthGuard returns true.

If the user is not authorized to access this route, and we'd only used a canActivate guard, the AdminModule would be loaded, even though the user would not be able to access that route.