Angular 2: Routing mit verschiedenen Arten von Nackteilen

Question

In meiner Komponente habe ich eine Liste von Menüpunkten. Eine besteht aus Post von anderen Seiten.

menu.component.ts

selectedPost(postslug){ 
    console.log('post slg ', postslug); 
    this._router.navigate([postslug]); 
} 

selectedPage(pageslug){ 
    console.log('page slg ', pageslug); 
    this._router.navigate([pageslug]); 
} 

app.routing.module.ts

const routes: Routes = [ 
    { 
    path: '', 
    component: PostListComponent, 
    pathMatch: 'full' 
    } 

    , 
    { 
     path: ':postslug', // This is for the posts 
     component: PostSingleComponent, 
    } 
    , 
    { 
    path: ':pageslug', 
    component: PageSingleComponent // This is for the pages 
    } 


]; 

Wie ich wegen benutzerdefinierten slug versteht sich, dass die ich es die richtige Komponente aufzunehmen und laden passieren sollte . Aber es lädt den ersten, der ': + etwas' hat.

Gibt es einen Weg um dies?

Wenn es nicht gibt gibt es eine Möglichkeit, über die Funktion eine benutzerdefinierte Kategorie und im Routing zu der Kategorie umleiten?

Zum Beispiel in der Funktion:

selectedPost(catName, postslug){ 
     console.log('post slg ', postslug); 
     this._router.navigate([catName, postslug]); 
    } 

Und in der Routing hätte ich:

const routes: Routes = [ 
    { 
    path: '', 
    component: PostListComponent, 
    pathMatch: 'full' 
    } 

    , 
    { 
     path: 'catName/:postslug', // This is for the posts 
     component: PostSingleComponent, 
    } 
    , 
    { 
    path: ':pageslug', 
    component: PageSingleComponent // This is for the pages 
    } 


]; 

Answer 1

unten versuchen,

const routes: Routes = [ 
    { 
    path: '', 
    component: PostListComponent, 
    pathMatch: 'full' 
    } 

    , 
    { 
     path: 'posts/:postslug', // This is for the posts 
     component: PostSingleComponent, 
    } 
    , 
    { 
    path: 'pages/:pageslug', 
    component: PageSingleComponent // This is for the pages 
    } 
]; 

und auf klicken,

selectedPost(postslug){ 
    console.log('post slg ', postslug); 
    this._router.navigate(['posts',postslug]); 
} 

selectedPage(pageslug){ 
    console.log('page slg ', pageslug); 
    this._router.navigate(['pages',pageslug]); 
} 

Überprüfen Sie die Dokumentation auf How Routing works here., es erklärt im Detail über Routing und Navigation.

Hoffe das hilft !!