Search code examples
angularangular2-routing

Prevent direct route access from a lazy-loaded module


From one of my modules (MasterModule), I load the MasterComponent and its child routes. One of these child routes lazy loads my EquipmentSLModule :

master-routing.module.ts :

const routes: Routes = [
  {
    path: 'master', redirectTo: '/master/dashboard', pathMatch: 'full'
  },
  {
    path: 'master',
    component: MasterComponent,
    children: [
      {
        path: 'dashboard',
        component: DashboardComponent,
      },

      ...  // Other routes

      {
        path: 'SL',
        loadChildren: './../equipment/equipment-SL.module#EquipmentSLModule'
      }
    ]
  }
];

From this sub-module, I add child routes :

equipment-SL-routing.module.ts

const routes: Routes = [
  {
    path: 'toto',
    component: EquipmentComponent,
  },
];

I can then access my route master/SL/toto successfully, but I can also directly go to /toto from the URL and it works as well. Is there a way to prevent the access to /toto only ?


Solution

  • If you want to prevent the access to /toto for no reason just remove it from your routing configuration, or use CanActivate if you want to make some conditions.

    //equipment-SL-routing.module.ts
    const routes: Routes = [
      {
        path: '',
        component: EquipmentComponent,
      },
    ];