title: Cancelling a chain of consecutive aynscronous requests
body: <p>Let's say a user input triggers an http request A, with the result of A, the application must make another request B and show the final result.</p>
  
  <p>If a new user input is received, all http requests should be cancelled.</p>
  
  <p>The example I have is chaining switchMaps. New clicks will abort and restart the first switchMap request. New output from the first switchMap will cancel &amp; restart the 2nd. But, a click will not restart the 2nd switchMap.</p>
  
  <p>I'd appreciate suggestions on how to rethink this. Cancelling requests is the goal, filtering/ignoring results is cheating :).</p>
  
  <p><a href="http://jsbin.com/roranoh/4/edit?js,console" rel="nofollow noreferrer">http://jsbin.com/roranoh/4/edit?js,console</a></p>
  
  <pre><code>function obFc(name) {
    return {
      next: function (x) { console.log(name+ ' - ' + x)  },
      error: function (err) { console.log(name +' error ' + err) },
      complete: function () { console.log(name +' done') },
    }
  };
  
  function simulateHttp(val: any, delay:number) {
      return Rx.Observable.of(val).delay(delay);
  }
  
  click1$ = Rx.Observable.of('1').delay(1000);
  click2$ = Rx.Observable.of('2').delay(4000);
  
  click$ = Rx.Observable.merge( click1$, click2$ );
  click$.subscribe( obFc('Click') );
  
  click$
    .switchMap( (val) =&gt; {
      console.log('Fetching data A' + val);
      return simulateHttp(val + " A", 2000);
    })
    .do((v)=&gt; console.log('received:' + v))
    .switchMap( val =&gt; {
      console.log('Fetching data B')
      return simulateHttp( val + " B", 2000);
    })
    .subscribe( obFc('Finished ') );
  </code></pre>
  
  <p>PS: I have seen some similar questions, although they seem to be very specific, I have tried to be as generic as possible.</p>