简体   繁体   中英

Angular routing with parameters in a child, lazy-loaded module? Can't match any routes thrown every time

I have a lazy loaded module which defaults to SuperUserComponent inside this component I have toggle navigation with ngSwitchCase between 4-5 child components. Because I'm using this with nativescript I need to have a separate routing module for this whole routing module.

Inside my main routing module I have:

 {
    path: 'super-user',
    loadChildren: './super-user/super-user.module#SuperUserModule',
    pathMatch: 'full'
  },

Inside the module's own child routing module I have:

const routes: Routes = [
  {
    path: ':resource',
    component: SuperUserComponent,
    pathMatch: 'full'
  }
];

The toggles for the switchase is as follows:

   <mat-button-toggle
        [routerLink]="['/super-user', 'manage-users']"
        value="manage-users"
      >
        Users
      </mat-button-toggle>

And on the backend I listen for that parameter every time I load the main component:

this.paramSubscription = this.route.paramMap.subscribe(params => {
      const newValue = params.get('resource');
      this.superUserMenu = newValue;
    });

How can I configure that child routing module to match that parameter when loading?

Made some research, all you need is to change your mai nrouting module

 {
    path: 'super-user',
    loadChildren: './super-user/super-user.module#SuperUserModule',
    pathMatch: 'prefix'
 }

or just remove that line pathMatch: 'prefix' if you don't need that. I think you just forcing angular to find route that ends with 'super-user', but he, obiously, can't do that.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM