Remove a parameter from queryParams angular 2

Imperative method, but cleaner:

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

Just in case people find this thread (like I did). I have the scenario that I receive a JWT token in a query string (/login?jwt=token). I needed to fetch this token (and store it etc), but then needed to make sure that it got safely removed from the URL. Reloading the login route (by using this.router.navigate(['login']) works in principe, however, the user can then use the browser back button, basically replaying the token login.

I solved this by not using the navigate but by DI'ing the 'Location' service (from @angular/common). This service has a replaceState method, which completely removes the token from the history as well as from the URL

 this.location.replaceState('login')

Hope that helps someone.

You can assign null to a specific queryParam :

this.router.navigate([], {queryParams: {page: null}, queryParamsHandling: 'merge'});

HTML5 includes the history.pushState API, which allows you to add history entries and change the URL currently displayed in the browser. (Manipulating the browser history)

window.history.pushState('', 'title', '/expected-url');

You can use this line of code in your Angular2 application. This will just change the URL not state of the application. (results query param remove from given url)