title: Angular - service object populated returns null
body: <p>I am using Angular 5 and ionic 3, what I am trying to do is to populate an object following a response endpoint, like this:</p>
  
  <p>user.service.ts</p>
  
  <pre><code>public UserInfo: UserData = {
      id: null,
      username: null,
      email: null,
      subscribeData: null,
      brand: null,
      fiscalcode: null,
  };
  
  populateBaseUserInfo(user) {
      this.UserInfo.id = user._id;
      this.UserInfo.username = user.username;
      this.UserInfo.subscribeData = user.subscribeData;
      this.UserInfo.email = user.email;
      console.log(JSON.stringify(this.UserInfo));
  } 
  </code></pre>
  
  <p>The response in <code>console.log</code> is ok:</p>
  
  <p><a href="https://i.stack.imgur.com/t7tGD.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/t7tGD.png" alt="the response in console.log is ok"></a></p>
  
  <p>but when I try to take the object in the component, the object returns all the fields as null...</p>
  
  <p>user.component.ts</p>
  
  <pre><code>import { UserService } from '../../service/user.service';
  @Component({
   providers: [UserService]
  })
  export class MainPage {
     public localUser: UserData;
  
     constructor(private UserService : UserService, ) {
         this.localUser = this.UserService.UserInfo;
     }
  )
  </code></pre>
  
  <p>user.html</p>
  
  <pre><code>{{localUser | json}}
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/1egP2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1egP2.png" alt="enter image description here"></a></p>
  
  <p>So, what am I doing wrong? What needs to be done to see the object json in the component as the same from the response?</p>
  
  <p>Thank you</p>