title: Angular 2: How to fetch data and return single values?
body: <p>A Accountpage should return Data to the logged in user. I've got following code:</p>
  
  <p><strong>http.get.service.ts</strong></p>
  
  <pre><code>getUserData() {
        const token = this.currentUser.token;
  
        const body = JSON.stringify({token: token});
        return this.http.post('https://test.com/src/getuserdata', body)
          .map((response: Response) =&gt; {
            const data = response.json();
            const returnArray = [];
            for (let key in data) {
              returnArray.push(data[key]);
            }
            return returnArray;
          });
      }
  </code></pre>
  
  <p>The Output of the called JSON File is:</p>
  
  <pre><code>{
  "email":"test@test.com","lastname":"Grimes"
  }
  </code></pre>
  
  <p><strong>account.component.ts</strong></p>
  
  <pre><code>export class AccountComponent implements OnInit {
  
    userData: any = [];
  
    constructor(private httpService: HttpService) { }
  
    ngOnInit() {
      this.httpService.getUserData()
        .subscribe(
          data =&gt; {
            this.userData = data;
          }
        );
    }
  
  }
  </code></pre>
  
  <p>The response of ngOnInit is "test@test.com, Grimes"</p>
  
  <p><strong>account.component.html</strong></p>
  
  <pre><code>...
  &lt;div class="n-r-m-e" [innerText]="userData.email"&gt;
  &lt;div class="n-r-m-e-v" [innerText]="userData.lastname"&gt;
  ...
  </code></pre>
  
  <p>The div-tags return "undefinded". How can i fix this problem?</p>