title: BehaviorSubject in shared service does not return updated value to Component
body: <p>I have 2 components: <code>TopBarComponent</code> and <code>UserDetailsComponent</code>. <code>TopBarComponent</code> is common to all pages, so gets loaded along with <code>UserDetailsComponent</code> also. I have added a shared service named <code>UserDetailsService</code>.</p>
  
  <p>UserDetailsService.ts:</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { BehaviorSubject } from "rxjs/BehaviorSubject";
  import { Observable } from "rxjs/Observable";
  
  @Injectable()
  export class UserDetailsService {
    public userData = new BehaviorSubject({});
  
    public setUserDetails(data: any) {
      this.userData.next(data);
    }
  
    public getUserDetails(): Observable&lt;any&gt; {
      return this.userData.asObservable();
    }
  }
  </code></pre>
  
  <p>I'm setting the API response data in <code>UserDetailsService</code> from <code>TopBarComponent</code></p>
  
  <p>TopBarComponent.ts</p>
  
  <pre><code>//setting data in Shared Service
  
  this.userDetailsService.setUserDetails(result.data); 
  </code></pre>
  
  <p>When I am subscribing to the getter method in the service, it always returning only initial value of <code>BehaviorSubject</code>.</p>
  
  <p>UserDetailsComponent.ts</p>
  
  <pre><code>this.userDetailsService.getUserDetails().subscribe(
    data =&gt; {
      console.log(data);    //prints '{}' always.
    },
    error =&gt; this.error(error)
  );
  </code></pre>
  
  <p>While I'm getting updated value in <code>UserDetailsService</code>, I'm always getting initial value of <code>BehaviorSubject</code>. </p>
  
  <p>Where I'm doing wrong? Any help will be appreciated.</p>