Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Get target route URL in CanActivate guard Lazy load modules Angular

I'm trying to get the target URL in canActivate guard but unable to do so. I've configured preloadingStrategy: PreloadAllModules in RouterModule.forRoot when i use ActivatedRoute its url property doesn't contain path. here's both of my module:

app.module.ts

const appRoutes: Routes = [
  { path: 'login', component: LoginComponent },
  {
    path: '',
    component: SiteLayoutComponent,
    children: [
      { path: '', redirectTo: 'dashboard', pathMatch: 'full' },
      {
        path: 'dashboard',
        loadChildren: './dashboard/dashboard.module#DashboardModule'
      },
      {
        path: 'user',
        loadChildren: './user/user.module#UserModule'
      }
    ]
  },
  { path: '**', component: PageNotFoundComponent }
];

@NgModule({
  declarations: [
    AppComponent,
    SiteLayoutComponent,
    LoginComponent,
    PageNotFoundComponent,
  ],
  imports: [
    RouterModule.forRoot(
      appRoutes,
      { enableTracing: false, preloadingStrategy: PreloadAllModules } 
    ),
    BrowserModule,
    BrowserAnimationsModule,
    HttpClientModule,
    HttpModule,
    FormsModule,
    CommonModule,
  ],
  providers: [AuthGuardAuthService, LoginService, SharedService],
  bootstrap: [AppComponent]
})
export class AppModule { }

user.module.ts

const appRoutes: Routes = [
    {
        path: 'user',
        children: [
            { path: '', redirectTo: 'create', pathMatch: 'full' },
            {
                path: 'create', component: CreateComponent, canActivate: [RouteGuard] //need activated route in this guard
            },
            { path: ':id/edit', component: CreateComponent },
            { path: 'list', component: UserListComponent }
        ],

    },
    {
        path: 'role',
        children: [
            { path: '', redirectTo: 'create', pathMatch: 'full' },
            {
                path: 'create', component: RoleComponent,
                resolve: {
                    Modules: RolesResolver
                }
            },
            {
                path: ':id/edit', component: RoleComponent,
                resolve: {
                    Modules: RolesResolver,
                }
            },
            { path: 'list', component: RoleListComponent },
        ],
    },
];

@NgModule({
    declarations: [
        CreateComponent,
        RoleComponent,
        UserListComponent,
        RoleListComponent
    ],
    imports: [
        CommonModule,
        FormsModule,
        RouterModule.forChild(
            appRoutes
        )
    ],
    providers: [RouteGuard, UserService, RoleService, RolesResolver],
})
export class UserModule { }

i need activated route in RouteGuard.

like image 870
Asad Shah Avatar asked Mar 21 '18 11:03

Asad Shah


People also ask

Which route Guard helps in controlling access to lazily loaded feature module?

To auth lazily-loaded routes, we will use the CanLoad guard, as recommended in the Angular docs.

What does the canActivate () method return when configuring guards in Angular?

The canActivate method returns a boolean indicating whether or not navigation to a route should be allowed. If the user isn't authenticated, they are re-routed to some other place, in this case a route called /login .

What is canActivate in Angular routing?

CanActivatelinkInterface that a class can implement to be a guard deciding if a route can be activated. If all guards return true , navigation continues. If any guard returns false , navigation is cancelled.

What is the difference between canActivate and CanDeactivate?

CanActivateChild - Decides if children routes of a route can be activated. CanDeactivate - Decides if a route can be deactivated.


1 Answers

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot){
    console.log("route-access", state);
}

from this answer.

like image 163
ForestG Avatar answered Nov 15 '22 07:11

ForestG