title: Proper way to bind to data object in Angular 2 service?
body: <p>I am building an angular 2 application. The documentation has changed quite a bit since the released which has caused confusion. The best I can do is explain what I am trying to do (Which was easy in Angular 1) and hope someone can help me out.</p>
  
  <p>I have created a login service using JWT's.
  Once login is successful, I return a user object.</p>
  
  <p>I have a loginComponent ( binds data to template ) and loginService ( which handles the https calls )</p>
  
  <p>I have a userService which maintains the user object. </p>
  
  <p>I have a userComponent which renders the user data. </p>
  
  <p>The problem is, once the user has logged in, I am unclear on the best approach for letting the userService retrieve the new data in an object called "user", then the userComponent update its user object on the template. This was easy in angular 1 simply by putting a watcher on the userService.user object.</p>
  
  <p>I tried Inputs and Outputs to no avail, eventEmitters, Observables and getters and setters. The getters and setters work, but force me to store everything in a "val()"</p>
  
  <p>Can someone please tell me the best way to achieve this?</p>
  
  <ol>
  <li>User Component renders template with user.firstName, user.lastName etc.</li>
  <li>Initially user if an empty Object</li>
  <li>The login service needs to set the UserService.user</li>
  <li>The userComponent Needs to detect the change and update the DOM.</li>
  </ol>
  
  <p>Thanks in ADVANCE!</p>