title: Angular 5 TypeError: Cannot read property undefined
body: <p>My utils service which returns the data from the mysql database using express framework</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { Http, HttpModule, Headers, RequestOptions } from '@angular/http';
  import { Component, OnInit } from '@angular/core';
  import { Observable } from 'rxjs/Observable';
  import 'rxjs/add/operator/map';
  
  @Injectable()
  export class UtilsService implements OnInit{
      public authData : any[];
      constructor(private http : Http) {
      }
  
      ngOnInit() { }
  
      getUserData() {
          const reqData = JSON.parse(localStorage.getItem('AuthUser'));
          return this.http.post('/get/logindata',reqData)
          .map(result =&gt; result.json().data);
      }
  }
  </code></pre>
  
  <p>My Component Section</p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { UtilsService } from 'app/appservices/utils.service';
  
  // Subscribers and mapping to get resutl
  import { Observable } from 'rxjs/Observable';
  import 'rxjs/add/operator/map';
  
  @Component({
      selector: 'app-navbar',
      templateUrl: './navbar.component.html',
      styleUrls: ['./navbar.component.scss']
  })
  
  export class NavbarComponent implements OnInit{
      result : any;
      constructor(private utils : UtilsService) {
          this.getLogData();
      }
      ngOnInit() {}
  
      getLogData() {
          this.utils.getUserData().subscribe(res=&gt; this.result = res);
      }
  }
  </code></pre>
  
  <p>HTML View</p>
  
  <pre><code>&lt;div class="row"&gt;
  &lt;span&gt;{{ result.DTP_User_Admin }}&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>When ever i tried to bind the data in html it gives</p>
  
  <pre><code>ERROR TypeError: Cannot read property 'DTP_User_Admin' of undefined.
  </code></pre>
  
  <p>But the subscribe returns an object with value when i use console.log(this.result);
  am using Angular 5.2.9</p>