web-dev-qa-db-ja.com

Angular 2 router.navigate

ルートとクエリパラメータが混在するAngular 2のルートに移動しようとしています。

ルートがパスの最後の部分であるルートの例を次に示します。

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

次のような配列を使用してリンクしようとしています：

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

私はエラーを受け取っておらず、理解できることからこれが機能するはずです。

Angular 2ドキュメント（現時点）には、例として次のものがあります。

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

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

私が間違っているところを誰でも見ることができますか？私はルーター3にいます。

javascriptangularangular2-routing
44
SpaceBeers

最初のセグメントが/で始まらない場合、それは相対ルートです。 router.navigateには、相対ナビゲーション用のrelativeToパラメーターが必要です

ルートを絶対にするか：

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

または、relativeToを渡します

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

こちらもご覧ください

81
Günter Zöchbauer
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'];
        });
}

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

10
yala ramesh