web-dev-qa-db-fra.com

Angular 5 Supprimer le paramètre de requête

Comment supprimer une requête param de l'URL. Par exemple de www.expample.com/home?id=123&pos=sd&sd=iii faire www.expample.com/home?id=123&sd=iii

EDIT: Ma version

this.activatedRoute.queryParams.subscribe(c => {
  const params = Object.assign({}, c);
  delete params.dapp;
  this.router.navigate([], { relativeTo: this.activatedRoute, queryParams: params });
}).unsubscribe();
javascriptangulartypescript
23
Nazar Kalytiuk

Malheureusement, il n’existe actuellement aucun moyen précis de procéder ainsi: https://github.com/angular/angular/issues/18011 . Cependant, comme le commentait jasonaden sur le fil lié,

Cela pourrait être fait manuellement en fusionnant l'ancien et le nouveau paramètre de requête, en supprimant la clé dont vous ne voulez plus.

Voici un moyen de le faire:

Supposons que vos queryParams soient stockés dans certaines propriétés.

class MyComponent() {
  id: string;
  pos: string;
  sd: string;

  constructor(private route: ActivatedRoute, private router: Router) {}

  ngOnInit() {
    this.route.url.subscribe(next => {
      const paramMap = next.queryParamMap;
      this.id = paramMap.get('id');
      this.pos = paramMap.get('pos');
      this.sd = paramMap.get('sd');
    });
  }
}

Une méthode pour effacer le paramètre pos ressemblerait à ceci:

clearPosParam() {
  this.router.navigate(
    ['.'], 
    { relativeTo: this.route, queryParams: { id: this.id, sd: this.sd } }
  );
}

Cela permettra de naviguer efficacement vers l’itinéraire actuel et d’effacer votre paramètre de requête pos, tout en maintenant les autres paramètres de requête.

10
vince

Vous pouvez supprimer un paramètre de requête en utilisant l'option merge de queryParamsHandling et en transmettant null pour tous les paramètres que vous souhaitez supprimer.

// Remove query params
this.router.navigate([], {
  queryParams: {
    yourParamName: null,
    youCanRemoveMultiple: null,
  },
  queryParamsHandling: 'merge'
})

Cette option est plus simple et nécessite moins de travail pour vous assurer de ne pas supprimer les autres paramètres. De plus, vous n'avez pas à vous soucier de nettoyer un abonnement observable lorsque votre composant est détruit.

32
epelc