Dynamisches Hinzufügen von Routen in Angular

Question

Ich versuche, dynamisch Routen in meinem Winkel App

const routes: Routes = [ 
// my static routes 
]; 

let sections = localStorage.getItem('sections'); 

if (sections) { 
    JSON.parse(sections).forEach(section => { 
    routes.push({ path: section.route, component: SectionComponent }); 
    }); 
} 

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

Dies funktioniert gut in dev hinzufügen, aber in einer Produktion, um die dynamischen Routen bauen nicht hinzugefügt werden. Ich habe versucht, eine Fabrik zu verwenden, um sicherzustellen, dass die Route hinzugefügt wird, aber es schlägt fehl, mit einem Funktionsaufruf zu erstellen.

@NgModule({ 
    imports: [RouterModule.forRoot(myRouteFactory())], 
    exports: [RouterModule] 
}) 
export class AppRoutingModule { 
} 

Ich habe auch versucht, meine Abschnitt Komponente als Default-Route einstellen, die meistens funktioniert, aber wenn ich von einem Abschnitt zum anderen gehen es nicht eine Route ändern und es bleibt auf dem ersten auslösen.

const routes: Routes = [ 
    { path: '**', component: SectionComponent } 
]; 

Wenn ich zu http://myap.com/firstsection gehe, funktioniert es gut. Wenn ich dann zu http://myap.com/secondsection gehe, bleibt es im ersten Abschnitt, obwohl die URL geändert hat.

Wenn ich dann gehe zu http://myap.com/oneofmystaticroutes dann zu http://myap.com/secondsection es funktioniert gut.

Answer 1

Ich denke, das Problem ist irgendwo in AOT.

Mein Vorschlag wäre mount route config zu AppComponent. Inject Router und Routen dann fügen Sie Routen, die Sie brauchen dann resetConfig

routes.push({ path: section.route, component: SectionComponent }); 
router.resetConfig(routes);