title: How can I change Angular2 route query parameters without navigating to the route?
body: <p>I have an angular2 page shows a list of items.  I restrict the list initially by using the route parameters so my URL is something like:</p>
  <blockquote>
  <p>http://localhost:54675/#/listing?filter={&quot;Country&quot;:[6, 7]}</p>
  </blockquote>
  <p>This will show items in the country with an ID of 6 or 7.</p>
  <p>Then the users adds a third country (let's say 8) and I make a service call which updates the list.  Since the list items are bound to an observable the list then updates on the screen.</p>
  <p>This is exactly the behavior I want.  But if the user bookmarks this page they only get the original route parameters and not the filtered results.</p>
  <p>To fix this, I use:</p>
  <pre><code>this._router.navigate(['listing', { filter: newfilter }]);
  </code></pre>
  <p>This reloads the page with this route:</p>
  <blockquote>
  <p>http://localhost:54675/#/listing?filter={&quot;Country&quot;:[6,7,8]}</p>
  </blockquote>
  <p>This keeps everything in sync and bookmarks work.  However, there is a full page refresh.  Other items load again - not just the filtered results.  I also like the visual results better when it's just a single service call.</p>
  <p>I need a way to change the route parameters without reloading the page.</p>