2016-08-04 20 views
6

Rotanın adını app.component.html şablonunda görüntülemek istiyorum. Böyle yazılabilir Ben basit bir çözüm arıyorum, bir şey:Köşeli 2, Geçerli rota adı nasıl görüntülenir? (yönlendirici 3.0.0-beta.1)

{{router.currentRoute.name}} 

Bulunduğum yönlendirici yapılandırma: En yolları veri özelliği gibi daki rota adıyla

export const routes: RouterConfig = [ 
    { 
     path: '', 
     redirectTo: '/catalog', 
     pathMatch: 'full' 
    }, 
    { 
     path: 'catalog', 
     name: 'Catalog', // Is this property deprecated? 
     component: CatalogComponent 
    }, 
    { 
     path: 'summary', 
     name: 'Summary', 
     component: SummaryComponent 
    } 
]; 
+1

Yeni yönlendiricide rota adı yok. –

+0

Eğer rota ismini görüntülemek istersem, kendi çözümümü kodlamalıyım? –

+0

Bunun için 'data' parametresi kullanılabilir. https://angular.io/docs/ts/latest/api/router/index/RouterConfig-type-alias.html –

cevap

14

yapılandırılmışsa Bu: senin app.component.ts Eğer import 'rxjs/add/operator/filter'; + import { ActivatedRoute, Router, NavigationEnd } from '@angular/router'; ve aşağıdaki yapabilirsiniz yılında

{ 
    path: 'somepath', 
    component: SomeComponent, 
    data: { 
     name: 'My Route Name' 
    } 
} 

:

constructor(
    private route: ActivatedRoute, 
    private router: Router 
) { } 

ngOnInit() { 
    this.router.events 
    .filter(event => event instanceof NavigationEnd) 
    .subscribe(event => { 
     let currentRoute = this.route.root; 
     while (currentRoute.children[0] !== undefined) { 
     currentRoute = currentRoute.children[0]; 
     } 
     console.log(currentRoute.snapshot.data); 
    }) 
} 

Bu NavigationEnd olayları dinleyecek ve sonra o rotanın data erişebilmesi için geçerli rotaya aşağı çapraz.

Yukarıdaki kodu kullanarak /somepage kullanıyorsanız, konsolunuza { name="My Route Name"} yazdırmanız gerekir.

+0

ile ilgili bir şey çok teşekkür ederim! –

+0

'TypeError: this.router.events.filter bir işlev değil ' – Matiishyn

+0

' rxjs'den 'filter' işlevini' almayı 'unutmayın. –