1

I was trying to find any information on the lifecycle application initialization. There are few types of guards. I'm interested in following types:

  • CanActivate
  • CanLoad
  • CanActivateChild

Suppose we have following route configuration:

  {
    path: '',
    component: ParentA,
    canActivate: [CanActivateGuard],
    children: [
      {
        path: 'childA',
        component: ChildA,
        canActivateChild: [CanActiveChildGuard]
      },
  }

and Main Routing:

{

      {
        path: 'parent',
        loadChildren: '@app/modules/parent.module#ParentModule',
        canLoad: [CanLoad]
      },
}

Now, when trying to open parent/childA. Which guard will be executed first? Will ParentA Component be rendered before the CanActivateChildGuard check?

Maxian Nicu
  • 2,166
  • 3
  • 17
  • 31

1 Answers1

1

The order should be:

  1. CanLoad
  2. CanActivateGuard
  3. CanActiveChildGuard

You can see more info in the console by enabling the tracing for the router as following during initialization:

RouterModule.forRoot(routes, { enableTracing: false })
michelepatrassi
  • 2,016
  • 18
  • 32
  • Will ParentA Component be rendered before the CanActivateChildGuard check? – Maxian Nicu Nov 23 '19 at 11:05
  • 1
    that's an interesting question, you could easily verify it by adding logs into the constructor of the parent and the child component. Going by logic, I would definitely say yes: the parent should load, then the child route should be evaluated and then loaded. By the way I could be wrong: could be that angular evaluate all the parent and child routing before loading anything. That's why I suggest to enable tracing and checkout the logs. – michelepatrassi Nov 23 '19 at 11:16