title: Angular 4: abort all pending $http requests on route change
body: <p>i have a <code>DataService</code>, eg.:</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { Http } from '@angular/http';
  
  @Injectable()
  export class DataService {
  
    constructor(private http: Http) {}
  
    getData(): Promise&lt;any[]&gt; {
      return this.http.get('/api/data')
        .toPromise()
        .then(response =&gt; {
          const js_res = response.json();
          if ( js_res.data ){
            return js_res.data as any[];
          } else {
            throw new Error(js_res.info || response.text); 
          }
        })
        .catch( err =&gt; { console.log(err); });
    }
  }
  </code></pre>
  
  <p>this <code>DataService</code> is called many times in each route. When the user change route, so many request can be pending, and i want abort all pending requests of the old route. </p>
  
  <p>I'm new on Angular 4, what is the right approach? </p>