2016-06-30 11 views
25

Angular 2'de bir rotaya ve sorgu parametrelerine sahip bir rotaya gitmeye çalışıyorum.Köşeli 2 yönlendirici.navigate

{ path: ':foo/:bar/:baz/page', component: AComponent } 

dizi şöyle kullanarak bağlamak için çalışılıyor:

this.router.navigate(['foo-content', 'bar-contents', 'baz-content', 'page'], this.params.queryParams) 

Ben herhangi bir hata almıyorum İşte

rota yolunun son parçası olan bir örnek yoldur ve anlayabildiğim bu işe yaramalı.

(şu anda) Açısal 2 docs bir örnek olarak şu var: Yanlış nereye gidiyorum

{ path: 'hero/:id', component: HeroDetailComponent } 

['/hero', hero.id] // { 15 } 

kimse görebilir miyim? Router'dayım 3

cevap

46

İlk bölüm / ile başlamıyorsa, göreceli bir yoldur.

this.router.navigate(['/foo-content', 'bar-contents', 'baz-content', 'page'], this.params.queryParams) 

veya relativeTo

this.router.navigate(['../foo-content', 'bar-contents', 'baz-content', 'page'], {queryParams: this.params.queryParams, relativeTo: this.currentActivatedRoute}) 

da

+1

Konuyu eskidir bilin ama benim anlayış için hızlı bir kaç soru: olmamalı Yukarıdaki 2 durumda 1.' 'this.router.navigate (** ['foo ** - içerik', 'bar-content', ....' (ilk segmentin başında/olmadan, göreceli olduğundan) 2. this.currentActivatedRoute dışında relatifiedTo için diğer olası değerler nelerdir? – Vikas

+0

Eğer göreceli olmanız isteniyorsa, o zaman lider '/' ihmal etmeyin, niyetim yoktu. Yol istediğiniz herhangi bir rota göreceli olarak. –

+1

Teşekkürler - ama cevabınızda, ilk bölüm bir/ile başlıyorsa, o zaman mutlak bir navigasyon olduğunu belirttiniz. Peki neden relatif gerekli? – Vikas

5

import { ActivatedRoute } from '@angular/router'; 
 

 
export class ClassName { 
 
    
 
    private router = ActivatedRoute; 
 

 
    constructor(r: ActivatedRoute) { 
 
     this.router =r; 
 
    } 
 

 
onSuccess() { 
 
    this.router.navigate(['/user_invitation'], 
 
     {queryParams: {email: loginEmail, code: userCode}}); 
 
} 
 

 
} 
 

 

 
Get this values: 
 
--------------- 
 

 
ngOnInit() { 
 
    this.route 
 
     .queryParams 
 
     .subscribe(params => { 
 
      let code = params['code']; 
 
      let userEmail = params['email']; 
 
     }); 
 
}

Ref: - https://angular.io/docs/ts/latest/api/router/index/NavigationExtras-interface.html