2016-07-07 5 views
14

質問パラメータでAngular2ルータのナビゲーション(ルータ3.0.0-alpha.7)を使用する方法を理解しようとしています。私は簡単にこのラインを持つqueryParamのルートに移動することができます新しいルータv3 Angular2ですべてのqueryParamsをクリアします

:「/ログイン」コンポーネントで

this._router.navigate(['/login'], {queryParams: {redirect: 'route1'}}); 

、私はここに、すなわちroute1のredirectルートにリダイレクトしますいくつかのログインを行います。ただし、リダイレクト後、redirectのクエリパラメータはURLに残ります。つまり、今はページ/route1?redirect=route1になります。ここではリダイレクトパラメータを削除したいと思います。

さらに、同じredirect queryParamを持つ別のページに移動すると、前のページを上書きしませんが、URLに別の?redirect=...を追加します。すなわち:

this._router.navigate(['/another-route'], {queryParams: {redirect:'route2'}}); 

/another-route?redirect=route2?redirect=route1

に私をリードし、ルート間を移動する際queryParamsをクリアすることが可能ですか? this._router.navigate(['/route1'], {queryParams: {redirect: null}});、または{queryParams: null}などを試しましたが、成功しませんでした。

答えて

18

私もこれで苦労しました。あなたは

あなたが行うことができます...別のルートに移動するとき、ルータは、デフォルトでは、クエリのparamsをクリアするために期待されるのいずれか

this._router.navigate(['/route1'], {queryParams: {}}); 

または

this._router.navigateByUrl('/route1'); 

または

routerLink使用:

<a [routerLink]="['/applications']" [queryParams]="{}"> Applications</a> 
+0

routerLinksでどのように達成できますか? ' Applications'は解析エラーをスローします。ドキュメントにはこれがありません。 – leovrf

+0

これを答えに追加します – yarons

+2

...解決策は空のクエリのパラメータをどこにでも追加することです*リンクはすべて使用されますか?それは.....恐ろしいです.... – dudewad

6

実際には... "はルータを期待しないでくださいo clear query params "と入力します。

明らかに、あなたはそれを期待しています。しかし、それはあなたが重要なルータ設計の決定を知らないためです...おそらく、残念ながら、私たちはまだ文書でそれについて教えていないので。私たちは今、それを修正しようと努めています。

QueryParamsは、ナビゲーション全体にわたってグローバルなパラメータです。彼らは変わらない。

MatrixParamsは、現在のナビゲーションに属するパラメータ用です。これらは変化する。

グローバルに属するものQueryParams?サーバーから提供されるものは候補者です。すべての相互作用に属する認証トークンと同じです。

しかしは paramsは経路(customer/:id:id)および(/customers;name=Jo*;name=Jo*等) paramsは任意マトリックスを必要1つのナビゲーションにローカルです。これは、オプションの名前フィルタを使用して顧客のナビゲーションを指定する方法です。

この方法に同意するかどうかは、v.3ルーターの設計にとって基本的なことです。

あなたの期待を調整することをお勧めします。

+0

いつMatrixParamsに関する追加の詳細を期待できますか? @Ward – JRulle

+1

更新されたルータの章の[クエリパラメータ](https://angular.io/docs/ts/latest/guide/router.html#!#query-parameters)のセクションにいくつかあります。 しかし著者と私はもっと明確にできると思います。私たちはもう一度それを更新します...すぐに。 – Ward

+0

ありがとう@Ward、私は更新されたルータのドキュメントに気をつけています – JRulle

0

あなたはこの試みるたいことがあります。

this.router.navigate([ 'ターゲット']、{preserveQueryParams:偽を});