Mehrere Komponenten von derselben faulen Route funktionieren nicht

Question

Frage - Kann ich mehrere Routen auf dasselbe lazy loaded Modul (und den zugehörigen Router?) Zeigen lassen. Ich bekomme immer wieder "Fehler: Keine Routen gefunden: 'Seite30'".

Hier ist meine app.routing.ts dass die träges Laden einrichtet:

const appRoutes: Routes = [ 
    { path: '', component: Page1Component },       // <-- default page 
    { path: 'Page1', component: Page1Component }, 
    { path: 'Page2', component: Page2Component }, 
    { path: 'Page3', component: Page3Component }, 
    { path: 'Page30', loadChildren: './+lazy/lazy.module#LazyModule' }, 
    { path: 'Page31', loadChildren: './+lazy/lazy.module#LazyModule' }, 

    // { path: '**', component: PageNotFoundComponent }   // <-- route not found 
]; 

export const appRoutingProviders: any[] = [ 

]; 

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes); 

Hier ist die + faul/lazy.routing.ts:

import { Page30Component } from './page30/page30.component'; 
import { Page31Component } from './page31/page31.component'; 

const routes: Routes = [ 

    { path: '', component: Page30Component }, 
    {path: 'Page30', component: Page30Component}, 
    {path: 'Page31', component: Page31Component} 

]; 

export const routing: ModuleWithProviders = RouterModule.forChild(routes); 

die zugehörigen routerLinks Hier sind . (P1 ist bestrebt, 30 & 31 faul sind):

{ label: 'Take Payment', icon: 'ui-icon-assignment-ind', routerLink: ['/Page1'] }, 
{ label: 'Loss Mitigation', icon: 'ui-icon-announcement', routerLink: ['/Page31'] }, 
{ label: 'Bankruptcy', icon: 'ui-icon-create', routerLink: ['/Page30'] } 

Wenn ich den 'entfernen' "Page30 'Standardpfad in dem faulen Routing, ich den Fehler: Kann keine Routen gefunden, die' get". Die routeLinks sehen nach rechts aus, wenn sie zu/Page30 und/Page31 wechseln - aber aus irgendeinem Grund werden sie nicht korrekt geroutet. Jede Hilfe wird geschätzt. FWIW, ich verwende Angular CLI mit Web Pack.

Answer 1

So funktioniert es mit { path: '', component: Page30Component }? Wenn dies der Fall ist, stelle ich mir vor, dass Seite30 als übergeordnete Route auf das Modul eingestellt ist und innerhalb der untergeordneten Ausgangspunkte die untergeordnete Route auf Seite30 eingestellt ist. So wären www.asdf.com/Page30/Page30 und www.asdf.com/Page31/Page30 gleichwertig.

die App Routen würde also sein:

const appRoutes: Routes = [ 
    { path: '', component: Page1Component },       // <-- default page 
    { path: 'Page1', component: Page1Component }, 
    { path: 'Page2', component: Page2Component }, 
    { path: 'Page3', component: Page3Component }, 
    { path: 'Lazy', loadChildren: './+lazy/lazy.module#LazyModule' }, 

    // { path: '**', component: PageNotFoundComponent }   // <-- route not found 
]; 

und die Kinder Routen sein könnten:

const routes: Routes = [  
    {path: 'Page30', component: Page30Component}, 
    {path: 'Page31', component: Page31Component}  
]; 

, die Sie über www.asdf.com/Lazy/Page30 und www.asdf.com/Lazy/Page31