title: How to properly flatmap three HTTP requests
body: <p>I have an app that makes 3 HTTP requests and each request relies on information from the others. Currently I am making the next request on success but that is inefficient. I did some research and found that I'm suppose to be using <code>flatmap</code> but the couple of ways I've tried dont make the http requests to the api </p>
  
  <p>This is what I've tried but it returns nothing</p>
  
  <pre><code>return this.info.getLastRecord(this.station)
        .map((res: any) =&gt; res.json()
        .flatMap((info: any) =&gt; {
          return this.info.getQueue(this.lastID)
            .map((res: any) =&gt; {
              console.log(res.json());
            });
        }));
  </code></pre>
  
  <p>This doesnt work either</p>
  
  <pre><code>return this.info.getLastRecord(this.station)
      .map((res: any) =&gt; res.json()
      .flatMap((res: any) =&gt; {
      return this.info.getQueue(this.lastID)
          .map((res: any) =&gt; {
          console.log(res);
       });
     }));
  </code></pre>
  
  <p>This is how i'm currently making the calls</p>
  
  <pre><code>this.getInfoService.getLastRecord(this.station)
    .subscribe(
      (info) =&gt; {
        console.log("res", info);
      },
      (error: Response) =&gt; console.log(error),
      () =&gt; this.getQueue()
    );
  
  getQueue() {
    this.info.getQueue(this.lastID)
    .subscribe(
      (info) =&gt; {
        console.log("getQueue", info);
      },
      (error: Response) =&gt; console.log(error),
      () =&gt; this.gHTDG())
  }
  
  getHookTypeDieGroup() {
  this.info.getHookTypeDieGroup(this.profileCode)
    .subscribe(
      (info) =&gt; {
        console.log("GHTDG", info);
      },
      (error: Response) =&gt; console.log(error)
    );
  }
  </code></pre>
  
  <p>info.service.ts</p>
  
  <pre><code>getLastRecord(station: string): any {
  return this.http.get('http://API.app/getLastRecord/' + station)
    .map(
      (response: Response) =&gt; {
        return response.json().info;
      },
    ).share();
  }
  
  getQueue(lastID: number): any {
  return this.http.get('http://API.app/getQueue/' + lastID)
    .map(
      (response: Response) =&gt; {
        return response.json().info;
      }
    )
    .share();
  }
  
  gHTDG(pCode: string): any {
  return this.http.get('http://API.app/getHTDG/' + pCode)
    .map(
      (response: Response) =&gt; {
        return response.json().info;
      }
    ).share();
  }
  </code></pre>