web-dev-qa-db-fra.com

Effacer tous les queryParams avec le nouveau routeur v3 Angular2

J'essaie de comprendre comment utiliser la navigation du routeur Angular2 (routeur 3.0.0-alpha.7) avec des paramètres de requête.

Je peux facilement naviguer vers un itinéraire avec un queryParam avec cette ligne:

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

Dans le composant '/ login', je crée des identifiants qui redirigeront vers la route redirect, à savoir route1 ici. Cependant, après la redirection, les paramètres de la requête redirect restent dans l’URL, c’est-à-dire que je suis maintenant à la page /route1?redirect=route1. Je veux supprimer le paramètre de redirection ici.

De plus, si je navigue ensuite vers une autre page avec le même redirect queryParam, cela n'écrasera pas la précédente, mais ajoutera un autre ?redirect=... dans l'URL. À savoir:

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

me conduit à /another-route?redirect=route2?redirect=route1

Est-il possible d'effacer les queryParams lors de la navigation entre les routes? J'ai essayé this._router.navigate(['/route1'], {queryParams: {redirect: null}});, ou {queryParams: null} etc. mais sans succès.

angularangular2-routing
17
amaurymartiny

J'ai eu du mal avec cela aussi. Vous vous attendez à ce que le routeur supprime les paramètres de requête par défaut lors de la navigation vers un autre itinéraire ... 

Vous pouvez faire soit

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

ou

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

ou en utilisant routerLink:

<a [routerLink]="['/applications']" [queryParams]="{}"> Applications</a>
21
yarons

En fait ... vous ne devriez PAS "attendre que le routeur efface la requête params".

Clairement, vous vous attendez à cela. Mais c’est parce que vous ne connaissez pas de décision importante en matière de conception de routeur ... probablement parce que, malheureusement, nous ne vous en avons pas encore parlé dans la documentation. Nous travaillons à corriger cela maintenant.

QueryParams sont pour les paramètres qui sont globaux à travers les navigations; ils ne changent pas.

MatrixParams sont pour les paramètres qui appartiennent à la navigation en cours; ceux-ci changent.

Qu'est-ce qui appartient à la variable globale QueryParams? Les éléments provenant du serveur sont des candidats. Comme les jetons d'authentification qui appartiennent à chaque interaction.

Mais les paramètres requis de route (le :id dans customer/:id) et les paramètres facultatifs de matrice (comme le ;name=Jo* dans /customers;name=Jo*) sont locaux pour une navigation. C'est ainsi que vous pouvez spécifier une navigation pour les clients avec un filtre de nom facultatif. 

Que vous soyez d'accord ou non avec cette approche, elle est fondamentale pour la conception du routeur v.3.

Je suggère d'ajuster vos attentes plutôt que de le combattre. 

7
Ward

Vous pouvez essayer ceci: 

this.router.navigate (['cible'], {preserveQueryParams: false});

0
Dracarys