Attempting to use object Object as an array in Angular 6

Question

Here's some context of my problem:

I am coding an app in Angular 6 that is supposed to read data from my localhost:5000 port to get JSON data and display it in the Angular app. The angular app is getting the data from my localhost perfectly, except when the data is gathered then the entire data is an " object Object " and I don't know how to iterate through this type or visualize the collected data. The reason I know that the data is correctly being gathered is that the server that is posting the data is getting 200-success messages.

Here is the data that my angular app is taking in:

{"index":1,"Company":"Google","Hire Date":"1\/4\/16","Title":"Director"
,"Location":"Bay Area, CA","Degree":"Bachelors","Year entered 
work force":1994.0,"Offer; Base":"$225,000.00 
","Bonus":null,"Latitude":37,"Longitude":-122}

Here is the data model I am fitting the data in Angular:

  export interface Exam {
    ID: number;
    Company: string;
    HireDate: string;
    Title: string;
    Location: string;
    Degree: string;
    yearEnteredWorkForce: string; 
    OfferCostNumber: string;
    bonus: string;
    latitude: number;
    longitude: number;
  }

Here is the variable that returns as an " object Object "

this.examsList = this.examsApi.getExams()

Enesxg, you want to code as this.examsApi.getExams().subscribe(res=>this.examList=res). GetExams is an Observable, you must subscribe and get the response — Eliseo, Aug 07 '18 at 13:01
Thank you Eliseo, Getting an error: "Type 'Subscription' is not assignable to type 'Exam[]'. Property 'includes' is missing in type 'Subscription'." — Enesxg, Aug 07 '18 at 13:43

Trupti J · Answer 1 · 2018-09-06T13:15:32.237

2

import { Observable, Subscription } from 'rxjs/Rx'; /* this should be added at the top of your file */

this.examsApi.getExams().subscribe(res => {this.examsList = res)
       /* Write code to do operation on your response object.*/
});

You will have to use subscribe method, you will get response object instead of just [object, Object].

edited Sep 06 '18 at 13:15

answered Aug 07 '18 at 13:15

Trupti J

512
1
4
16

Getting an error: "Type 'Subscription' is not assignable to type 'Exam[]'. Property 'includes' is missing in type 'Subscription'." – Enesxg Aug 07 '18 at 13:43
to be able to use subscribe, your response from getExams() method should be of type Observable. Do you use Http.get method to call your API? See working example of using http.get method in angular 6 here https://angular.io/tutorial/toh-pt6 Also, you need to add statement: import { Observable, Subscription } from 'rxjs/Rx'; – Trupti J Aug 07 '18 at 13:54

score 0 · Answer 2 · answered Aug 07 '18 at 14:15

It's hard to say, because we don't know what your service returns. If you log the object in your HTML as {{examsList}} it will always show up as [object object].
Another Problem might be that your data is only an object while the error messages you wrote in the other comments show that you try to assign an Array to an object. The following should work if you use the http client to get your data:

// In your service
getExams(filename: string) {
   return this.http.get('url to json').pipe(map(response => response.data))
}

And in your controller just what Trupti wrote

Attempting to use object Object as an array in Angular 6

2 Answers2