How to get the data from db

Question

I have an API by which i want to display data by certain conditions,here i am getting the details as,

My service Component,

    @Injectable()
    export class GetAllList {
    id = localStorage.getItem('social_id')
    private _productUrl =    'http://localhost/a2server/index.php/profile/getProfile/'+this.id;
   constructor(private _http: Http) { }
    getList(): Observable<IDetails[]> {
    return this._http.get(this._productUrl)
    .map((response: Response) => { 
    return <IDetails[]> response.json(); 
    });
      }
         }

My Observable,

   export interface IDetails{
    profile_id:number;
    firstname: string;
    lastname: string;
    profilename: string;
    phone:string;
    email:string;
    address:string; 
    }

I am using these service in my main component as

 ngOnInit(){
  this._service.getList()
 .subscribe(details => this.details = details); 
  }

This works well,if i want to check firstname in console,how would i do that?Is it like these.....

ngOnInit(){
  this._service.getList()
 .subscribe(details => this.details = details); 
  console.log(this.details[0].firstname);
  }

Can any one suggest help please......

Answer 1

 ngOnInit(){ this._service.getList().subscribe(details => { this.details = details; for(let detail of this.details) { console.log(detail.firstname); } }); } 

Answer 2

You need to wrap your console.log in curly braces, like this:

    ngOnInit(){
      this._service.getList()
     .subscribe(details => { this.details = details; 
console.log(this.details[0].firstname);
}); }

This makes sure that you don't log it to the console unless you have fetched the data.

Answer 3

Use it as suggested below.

ngOnInit(){

  this._service.getList().subscribe((data) =>{    
    this.details = data; 

    this.details.forEach((detail)=>{
          console.log(detail.firstname);  
    })

  });

}