title: Angular 2 how to make a nested observable
body: <p>I am trying to write up our httpService, it should have a post method that checks to see if a cookie exists with an auth token, if it does then it should append the auth header and make the post request.</p>
  
  <p>However if the cookie doesn't exist I need to load a local json file that contains the token and use it to create the cookie, then append the auth header and make the post request.</p>
  
  <p>The issue I'm having is that if the cookie doesn't exist I need to make a observable wait for another observable. I had thought the solution was to use switchMap, but that doesn't play well with .subscribe which is necessary for the http.post request to initialize.</p>
  
  <pre><code>  private makePostRequest(address: string, payload: any, callback: any): Observable&lt;any&gt; {
      return this.http.post(address, payload, { headers: this.headers })
        .map(callback)
        .catch(( error: any ) =&gt; this.handleError(error));
    }
  
    public post(address: string, payload: any, callback: any): Observable&lt;any&gt;     {
         if (this.hasOAuth2()) {
           this.appendHeader(this.cookieService.get('oauth2'));
           return this.makePostRequest(address, payload, callback);
         } else if (this.isLocalhost()) {
           return this.setAuthCookie()
             .switchMap(() =&gt; this.makePostRequest(address, payload, callback));
         } else {
           return this.handleError('Could not locate oauth2 cookie');
         }
    }
  
    private setAuthCookie(): Observable&lt;any&gt; {
      return this.http.get('./json/token.json')
        .map((res: Response) =&gt; {
          let oauth2: any = res.json();
          this.cookieService.set('oauth2', oauth2.access_token, oauth2.expiration);
          this.appendHeader(oauth2.access_token);
        })
        .catch((error: any) =&gt; {
          console.log('No dev token was found', error);
          return Observable.throw(error);
        });
    }
  </code></pre>
  
  <p>Update: Where this gets weird is that more or less the exact game code works correctly with a get request.</p>
  
  <pre><code>  private makeGetRequest(address: string, callback: any): Observable&lt;any&gt; {
      return this.http.get(address, { headers: this.headers })
        .map(callback)
        .catch(( error: any ) =&gt; this.handleError(error));
    }
  
    public get(address: string, callback: any): Observable&lt;any&gt; {
        if (this.hasOAuth2()) {
          this.appendHeader(this.cookieService.get('oauth2'));
          return this.makeGetRequest(address, callback);
        } else if (this.isLocalhost()) {
          return this.setAuthCookie()
            .switchMap(() =&gt; this.makeGetRequest(address, callback));
        } else {
          return this.handleError('Could not locate oauth2 cookie');
        }
    }
  </code></pre>
  
  <p>Solution: I wasn't subscribing to the httpService.post observable so it wasn't ever being initialized.</p>