Angular 2 Routing umleiten immer Wurzelpfad

Question

I Angular 2 rc4 bin mit und ich habe die neue Routing-ähnliche

const routes: RouterConfig = [{ 
    path: '', 
    component: PublicLayoutComponent, 
    children: [ 
     { path: '', component: HomeComponent}, 
     { path: 'login', component: LoginComponent} 
    ] 
}] 

für diesen Code benutzte ich die Route nicht zugreifen kann /login Ich will nur wissen, was falsch es ist immer Redirect zum root, bitte helfen

Answer 1

Ich denke, das Problem könnte sein, dass der Stammpfad (PublicLayoutComponent) und der erste untergeordnete (HomeComponent) den gleichen Pfad haben.

dh: Welche Komponente erwarten Sie zu sehen, wenn Sie zu http://localhost:4200/

navigieren Versuchen Sie es zu dieser Veränderung zu sehen, ob es funktioniert?

const routes: RouterConfig = [{ 
    path: '', 
    component: PublicLayoutComponent, 
    children: [ 
     { path: 'home', component: HomeComponent}, 
     { path: 'login', component: LoginComponent} 
    ] 
}] 

Answer 2

Angular Es können keine Routen gefunden werden: 'Login'. Bitte haben Sie einen Blick auf Baum wie folgt:

        App 
            /\ 
           /\ 
          Private Public 
             /\ 
            /\ 
            Home Login 

Dann wird der Code wie folgt aussehen:

export const routes: RouterConfig = [ 
    { path: '', redirectTo: 'public', pathMatch: 'full' }, 
    { path: 'private', component: PrivateComponent }, 
    { path: 'public', component: PublicComponent, 
    children: [ 
     { path: '', redirectTo: 'home', pathMatch: 'full' }, 
     { path: 'home', component: HomeComponent}, 
     { path: 'login', component: LoginComponent} 
    ] 
    } 
]; 

Hope this Hilfe!

Answer 3

Dies ist ein alter Thread - aber noch keine Antwort. Wenn es jemand hilft - fand ich, dass für meinen Fall durch das Hinzufügen zu den RouterModule.forRoot Optionen:

RouterModule.forRoot(appRoutes, 
     { enableTracing: true } // <-- debugging purposes only 
) 

Angular.io router docs

Ich fand dann, dass eine verschachtelte Komponente eine Ausnahme wirft. Nach dem Reparieren funktionierte mein Routing. Was passierte, war, dass das Routing funktionierte, es wurde gerade in die Luft gesprengt, als es die Last dieser 1 Komponente erreichte, die so eckig ist, dass sie die Seitenladung beendet und standardmäßig auf die Basis-URL setzt. Dies ist vermutlich aus Sicherheitsgründen, wenn die fehlerhafte Komponente die Seitensicherheit beeinträchtigt.

Answer 4

Sie haben den generischen Pfad '' als erstes Element, aber Sie haben pathMatch nicht auf voll gesetzt, so dass der Pfad mit allem übereinstimmt. Basierend auf der aktuellen Router-Konfiguration, findet es die erste Übereinstimmung in der Routenliste und sendet den Benutzer dorthin. In diesem Fall wird '' '' '' '' '' '' '' übereinstimmen, so dass es immer nur dorthin geht und nicht weiter in der Routenliste nach unten geht. Lesen Sie die Dokumentation hier: https://angular.io/guide/router#configuration

Ich denke, Sie haben sollten:

const routes: RouterConfig = [{ 
    path: '', 
    component: PublicLayoutComponent, 
    children: [ 
     { path: '', component: HomeComponent, pathMatch: 'full'}, 
     { path: 'login', component: LoginComponent} 
    ] 
}]