title: Angular – Retrieving data from dynamic url based on parametrized route
body: <p>I want to get the data by route with parameters. In html the call is like this:</p>
  
  <pre><code>&lt;a routerLink="my-component/2017"&gt;2017&lt;/a&gt;
  </code></pre>
  
  <p>The component mainly looks like this:</p>
  
  <pre><code>export class MyComponent implements OnInit, OnDestroy  {
    year: string;
    destination: any[];
  
    constructor(private _route: ActivatedRoute,
                private _info: MyService) {}
  
    ngOnInit() {
      const urlBase = 'http://...';
      this.subsUrl = this._route.paramMap.subscribe(
                    params =&gt; { this.year = params.get('year'); });
  
      this._info.url = urlBase + this.year;
      this.subsTree = this._info.getJsonData()
                                .subscribe(resultArray =&gt; this.destination = resultArray,
                                           error =&gt; alert(error));
    }
  
    ngOnDestroy() {
      this.subsTree.unsubscribe();
      this.subsUrl.unsubscribe();
    }
  </code></pre>
  
  <p>and the service:</p>
  
  <pre><code>@Injectable()
  export class MyService {
    url: string;
  
    constructor(private _http: HttpClient) { }
  
    getJsonData() {
      return this._http
        .get(this.url)
        .catch(this.handleError);
    }
  }
  </code></pre>
  
  <p>The service returns correctly the data for a single parameter (the year). My problem is that if I change the year the data doesn’t change, until I manually refresh the page.</p>