Angular2 Geçerli güzergahın takma adı:

Question

Geçerli yolun yolunu gibi alabiliyorum:/about, /,/news with location.path(). Ancak bunun yerine takma adını nasıl alabilirim ('bir rota tanımındaki' bölüm 'olarak)?

{ path: '/about', as: 'About', component: About } 

Mümkün mü?

Answer 1

onu almanın bir yolunu göremiyorum, ama bir alternatif yerine Yönlendirici örneğini kullanmalısınız, rota

https://angular.io/docs/ts/latest/api/router/RouteData-class.html

Answer 2

Sen konumu kullanmamalısınız diğer adını geçmesine RouteData kullanmaktır. Sana yönlendiriciden olarak elde nasıl emin değilim

this.router.currentInstruction.component.routeName 

: Birlikte bileşenin adını elde edebilir, daha

constructor(public router: Router) 

: En bileşeninde

ile yapıcı içinde enjekte yapılandırma. Ama RouterLink yönergesi başlangıç ​​için doğru nokta olmalıdır: https://angular.io/docs/ts/latest/api/router/RouterLink-directive.html

Answer 3

olası diğer adların listesini biliyorsanız o zaman router.generate ve route.isActiveRoute bir arada kullanarak geçerli takma adını bulmak mümkündür:

için örneğin, üç adımda bir sihirbaz var. Bir dizide adım takma adları listesi var:

const alias = this.wizardAliases 
    .map(alias => ({ alias, navigationInstruction: this.router.generate([alias]) })) 
    .filter(x => this.router.isRouteActive(x.navigationInstruction)) 
    .map(x => x.alias); 

if (alias.length === 1) { 
    console.log(`alias is ${alias}`); 
} 

Destek:

private wizardAliases = [ 
    'wizardStep1', 
    'wizardStep2', 
    'wizardStep3' 
]; 

Sonra geçerli takma adını belirlemek için aşağıdaki kodu kullanabilirsiniz ben bu işlerin olmadığını görmek için denemedim rota parametreleri ile.

Answer 4

NOT: Aşağıdakiler 2.0 beta serisi ile test edilmiştir. RC sürümlerinde, değişiklikleri değiştirerek güncellenmiş bir yönlendirici bileşeni vardır. Eski olan, router-deprecated olarak yeniden adlandırıldı. Bu henüz yeni yönlendiriciye karşı test edilmedi.

Aşağıdakiler, etkin rotanıza bağlı olarak Foo veya Bar yazdıracaktır. > = Angular2 RC.x için

@Component({ 
    selector: 'app', 
    templateUrl: 'app/app.html', 
    directives: [ROUTER_DIRECTIVES] 
}) 
@RouteConfig([ 
    {path:'/', name: 'Foo', component: FooComponent, useAsDefault: true}, 
    {path:'/bar', name: 'Bar', component: BarComponent, useAsDefault: false}, 
]) 
export class AppComponent implements OnInit { 
    constructor(private _router: Router) { 
    } 

    ngOnInit() { 
     console.log('current route name', 
        this._router.currentInstruction.component.routeName); 
    } 
} 

Answer 5

(yeni yönlendirici)

yeni yönlendirici içinde artık hiçbir takma adlar vardır.

yerel bileşeni

routerOnActivate(curr:RouteSegment, prev?:RouteSegment, currTree?:RouteTree, prevTree?:RouteTree):void { 
    console.log(curr.stringifiedUrlSegments); 
    } 

veya diğer adı almak istiyorum neden

constructor(private router:Router) {} 

    routerOnActivate(curr:RouteSegment, prev?:RouteSegment, currTree?:RouteTree, prevTree?:RouteTree):void { 
    console.log(this.router.serializeUrl(tree)); 
    } 

veya

constructor(router:Router, private location:Location) { 
    router.changes.subscribe(() => { 
    console.log(this.location.path()); 
    }); 
}