Remove a parameter from queryParams angular 2

Question

I navigate to a certain page in my app with a query parameter. After I get the parameter from the URL I want to delete it, ideally I would have this:

Answer 1

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)

Answer 2

I use the router method navigateByUrl.

Alternate doc: Angular documentation

Keep in mind that the path you feed it is treated as absolute. You cannot use relative component routing with this method.

My use is I have a component that serves as an external callback for auth events, such as resetting the password and email validation. Once the operation is complete, any navigation action needs to occur happens through router.navigateByUrl(path)

Answer 3

UPDATE It is not necessary to add queryParams in rc6 anymore.

Not sure if it is the case:

After routing to a component with query params, all the other urls in this component contain the query params automatically. Anytime you navigate to another url the query params stay.

If so, one possible solution could be at query params on html tag

<a [routerLink]="['/abcd']" [queryParams]="{}">

If not, I am actually also interested in the answer :P