Ability to easily update/add/subtract Route Params

I’m submitting a …

[ ] bug report => search github for a similar issue or PR before submitting
[x] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

As a disclaimer: there may very well be a way to easily accomplish this, but I’m not aware of it. My searching of Issues, SO or my SO question (http://stackoverflow.com/questions/41205929/how-to-update-matrix-parameters-in-angular2) didn’t return a good way to accomplish what I wanted

Expected behavior I would expect (want) features such as Router#updateParam(param: string), which would add/update a matrix parameter in the URL, and some version of the opposite, which would subtract a parameter from the URL if it existed.

Current behavior In order to update route parameters, I must build a parameters object from the current Params, and then hand it over to the router again.

Steps to get this currently Right now, I’ve got this messy bit of logic in order to add/update matrix parameters in the URL. As you can see, this function

  goToPage(pageNum: number) {
    if (this.pagination.currentPage !== pageNum) {

      let currentParamsArr: Params = this.route.snapshot.params;
      let currentParamsObj: any = { };
      for (let param in currentParamsArr) {
        currentParamsObj[param] = currentParamsArr[param];
      }
      currentParamsObj.currentPage = +pageNum;

      this._router.navigate([currentParamsObj], { relativeTo: this.route });
    }
  }

What is the motivation / use case for changing the behavior? I’ve got an asset viewing component which shows an array of thumbnails. It has a pagination component on it, where the user can use buttons (<< >>) to navigate pages. All the getting/cleaning of assets and data happen in a service though, which reads the router snapshot of params in order to know what to search for (contains bunches of parameters like filters, page size (how many it wants), page number, etc… So, after making these updates to the URL, any component that wishes to update the assets (thumbnails, eventually larger pictures, so on…) can simply trigger the service to fetch new data. The data is stored in observables, and all the components are happy when they get the data.

Please tell us about your environment: Developing on Mac using VSCode as IDE and Yarn as a package manager, building with webpack

• Angular version: 2.2.4

• Language: TypeScript 2.0.10, ES6

Related Issue: I found this issue (https://github.com/angular/angular/issues/3921#event-700019017), which seems to make two requests. One is specifically related to the old router, and now is fixed, but it also requests methods to easily update/add/subtract matrix parameters from the URL. The conversation after this request got more tied up in a discussion of automatic component reloading, and this request got lost in the shuffle.

[dougellison]

@vsavkin How would someone accomplish this if they wanted to update a param in the middle of a route? Something like

/main-site;someParam=1/child/child2 // Make change /main-site;someParam=2/child/child2

If I’m at the main-site route how do I merge 2 UrlTrees together?

I created a plunker illustrating what I’m trying to do: https://plnkr.co/edit/2wy8uXIX2f9E10bLkKgY?p=preview

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}