Angular2 Submodul forChild() Routen überschreiben Root-Routen

Question

Ich habe mit dem Problem konfrontiert, Root-Routen zu überschreiben, wenn importierte untergeordnete Routen mit loadChildren() aufrufen.

App Routen erklärt wie:

const routes: Routes = [ 
    { path: '', redirectTo: 'own', pathMatch: 'full' }, 
    { path: 'own', component: OwnComponent }, 
    { path: 'nested', loadChildren:() => NestedModule}, 
]; 
export const routing = RouterModule.forRoot(routes); 

Nested Submodul der Routen:

const routes: Routes = [ 
    { path: 'page1', component: NestedPage1Component }, 
    { path: 'page2', component: NestedPage2Component }, 
    { path: '', redirectTo: 'page1', pathMatch: 'full' }, 
]; 

@NgModule({ 
    imports: [RouterModule.forChild(routes)], 
    exports: [RouterModule] 
}) 
export class Module1RoutingModule {} 

Ich kann/eigene bekommen,/geschachtelte/Seite1,/geschachtelte/page2, aber wenn ich versuche, root zu bekommen/- Ich werde auf/page1 umgeleitet. Warum passiert das, wie es im untergeordneten Modul mit RouterModule.forChild deklariert ist, wie leitet es sich nicht an/own?

Ich habe für Repro einfache zupfen erstellt - https://plnkr.co/edit/8FE7C5JyiqjRZZvCCxXB?p=preview

Hat jemand dieses Verhalten erlebt?

Answer 1

Hier ist Ihre gegabelt und modifizierte Plunker: https://plnkr.co/edit/XilkY55WXle2hFF0Pelx?p=preview

Sie, dass faule Lademodul nicht importieren und die Root-Routen wie folgt zu ändern:

//import { Module1Module } from "./module1/module1.module"; // do NOT import it ! 

export const routes: Routes = [ 
    { path: '', redirectTo: 'own', pathMatch: 'full' }, 
    { path: 'own', component: OwnComponent }, 
    { path: 'module1', loadChildren: 'src/module1/module1.module#Module1Module' }, 
]; 

Und die verschachtelten Routen:

const routes: Routes = [ 
    //{ path: 'page1', component: Module1Page1Component }, 
    //{ path: 'page2', component: Module1Page2Component }, 
    //{ path: '', redirectTo: 'page1', pathMatch: 'full' }, 

    // do the routes like this.. 
    { 
    path: '', 
    component: Module1Component, 
    children: [ 
     { path: '', redirectTo: 'page1', pathMatch: 'full' }, 
     { path: 'page1', component: Module1Page1Component }, 
     { path: 'page2', component: Module1Page2Component } 
    ] 
    }, 
]; 

Answer 2

Wir brauchen einige CAPS auf dem "Importieren Sie nicht das launisch geladene Modul" :)

Das behebt ein Problem, das ich mit meinem Ansatz hatte, in einer verwandten Frage erläutert: https://stackoverflow.com/a/45718262/885259

Vielen Dank!