title: Retrive array of object from json array of object though http request typescript angular 5
body: <p>I want to retrieve array of object from another JSON array of object, which I am getting through HTTP request in angular 5 and want to display the values in console.Here I can successfully call the HTTP request and able to subscribe the service.</p>
  
  <p>When parsing through *ngFor in template its working fine, but when I am directly accessing in typescript file, its showing undefined value in console.</p>
  
  <p>My JSON like this.</p>
  
  <pre><code>{"data":[
     {
     userId: 1,
     id: 1,
     title: 'Loreum ispum',
     body: 'dummy text' 
     },
     {
     userId: 1,
     id: 1,
     title: 'Loreum ispum',
     body: 'dummy text' 
     },
     {
     userId: 1,
     id: 1,
     title: 'Loreum ispum',
     body: 'dummy text' 
     }]
  }
  </code></pre>
  
  <p>I can access it though ngFor in html file, its giving the value, but when I am accessing in typescript like console.log(this.obj[data]); its showing undefined.</p>
  
  <p>I need to create a new array which having only id and title field in angular 5
  Kindly help. My Service page</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { HttpClient, HttpHeaders, HttpResponse } from'@angular/common/http';
  import { Observable } from 'rxjs/Observable';
  import { Subject } from 'rxjs/Subject';
  const httpOptions = {
      headers: new HttpHeaders({ 'Content-Type': 'application/json' })
  };
  @Injectable()
  export class ConfigService {
  private URL: string = 'some URL';
  constructor(private http:HttpClient) {}
  getData(): Observable&lt;any&gt;  {
  return this.http.get(this.URL+ '/getdata', {responseType: 'json'});
  }
  }
  </code></pre>
  
  <p>My component</p>
  
  <pre><code>import { Component, OnInit, Input } from '@angular/core';
  import { ConfigService } from '../services/config.service';
  import { FormControl } from '@angular/forms';
  import { SelectionModel } from '@angular/cdk/collections';
  import { FlatTreeControl } from '@angular/cdk/tree';
  import { Observable, BehaviorSubject } from 'rxjs';
  @Component({
    selector: 'app-child',
    templateUrl: './child.component.html',
    styleUrls: ['./child.component.css']
  })
  export class childComponent implements OnInit {
  allData: any = [];
    getALLData() {
      this.config.getData().subscribe(
        data =&gt; { this.allData= data['data']},
        err =&gt; console.error(err),
        () =&gt; console.log('done loading data')
      );
    }
  
    ngOnInit() {
      this.getALLData();
      console.log(this.allData);   //here its showing undefined in console
    }
  }
  </code></pre>
  
  <p>Kindly help on this</p>