angular2 - Navigate after observable is complete
<p>I have an <code>http</code> observable like so, in my <code>UserService</code>:</p>

<pre><code>logout() {
    return this.http.delete(this.baseUrl + url, {
          headers: this.headers()
        }).map((res: IResponse) =&gt; {
          var json = res.json();
          json.headers = res.headers;
          return json;
        }).subscribe((response) =&gt; {
          //DO SOMETHING, THEN ----
          return res;
        });
}
</code></pre>

<p>I have created an observable, and created a subscription (<code>response</code>) which is the returned success value.</p>

<p>Now, in my component, I want to call <code>UserService.logout()</code> and THEN navigate to a new route:</p>

<pre><code>logout() {
    this.userService.logout();
    this.router.navigate(['LandingPage']);
  }
</code></pre>

<p>Obviously, this could happen asynchronously and I may end up navigating before I logout.</p>

<p>Using promises, I could do something like this:</p>

<p><code>this.userService.logout().then(() =&gt; {
    this.router.navigate(['LandingPage']);
});</code></p>

<p>How can I do the same thing with observables? In my <code>UserService</code> class I want to create an observable, subscribe to it, do some stuff on success or on error, THEN navigate from my view component.</p>