title: Binding URL Params via RouterLink in Angular App
body: <p>I am trying to understand what a basic implementation of loading a routerLink while also pulling in saved url params would look like. Normally, the way I handle routing in my app is via a subscribing to an observable, that looks like this:</p>
  
  <pre><code>private onFilterProcessed(value: any, type: string, body, page)
  {
      if (type === 'zip')
      {
          this.processType('addresses.zip', value);
      } if (type === 'location')
      {
          this.processType('addresses.city', value);
  
      this.filtersService.getByCategory(
          page, this.pagesize, this.body)
          .subscribe(resRecordsData =&gt; {
              let data = resRecordsData.data;
          },
          responseRecordsError =&gt; this.errorMsg = responseRecordsError);
  }
  </code></pre>
  
  <p>This allows me to pass in some filter parameters to the api call as part of the body in a POST request. This will return results where the user's filter selections are passed in before returning the data.</p>
  
  <p>This all works as expected. When a user goes "back" to a previously loaded component, their previous filter selections will be passed into the api call, so the "page" looks just like it did when they were last on that page/component.</p>
  
  <p>However, I also have a couple of sections in my app where I'm loading components via routerLink instead. They initially looked like this:</p>
  
  <pre><code>&lt;a routerLink="/customer-history" routerLinkActive="selected"&gt;Customer History&lt;/a&gt;
  </code></pre>
  
  <p>The thing is, now that I have filter params in the url, this alone won't work, because each time I click on these particular links, it will wipe out the url and re-load it with just the page identifier "customer-history" -- because that's what I'm currently telling it to do.</p>
  
  <p>If, for instance, the filters had been used by the user to filter results based on a city, the url would look like this:</p>
  
  <pre><code>http://localhost:4200/customer-history;locations=true;locations_place=Seattle
  </code></pre>
  
  <p>So the problem is, if they were to click away, and then RETURN to that page/component via the routerLink link, instead of getting the filtered data for that page, it will instead load this:</p>
  
  <pre><code>http://localhost:4200/customer-history
  </code></pre>
  
  <p>So my question is about how to pass those url params in as part of the routerLink. I assume it would look something like this, with square brackets for binding:</p>
  
  <pre><code>&lt;a [routerLink]="['/customer-history', getParams()]" routerLinkActive="selected"&gt;Customer History&lt;/a&gt;
  </code></pre>
  
  <p>What I'm not clear on is how I get those specific url params (just the filter params, not the component/page name) and pass them in via binding like this. </p>
  
  <p>I know Angular makes available activatedRoute.snapshot, which I could get like this, to pass into <code>getParams()</code>:</p>
  
  <pre><code>getParams()
  {
      return this.activatedRoute.snapshot;
  }
  </code></pre>
  
  <p>But this will return the full url, not just the filter params part, which is what I need. So how would I get the part of the url I need, and pass it in here to append to "customer-history" in the url?
   What would that look like in a basic implementation?</p>