Teemo
Teemo

Reputation: 111

Angular 6 services, HTTPClient

I am new to Angular 5 and I am currently trying to display data from a database to a view. But I am definitely doing something wrong since the view is just getting [object object]. I would like some help in what I am doing wrong.

Thank you.

ServiceThe service to use

Component using the service enter image description here

The Component's HTML enter image description here

The View

enter image description here

Upvotes: 0

Views: 7454

Answers (3)

Mohit Jain
Mohit Jain

Reputation: 351

In your case user is an object, 1. if you want to display an object then use JSON pipe.

   {{user | json}}

2. If you want to display sub property of an object then use

{{user.propertyName}} 

for example :

{{user.firstName}}

Upvotes: 0

Tavi
Tavi

Reputation: 41

To display the students (not like JSON) , you need to call object.property , in your case user.first_name, user.last_name, user.user_type. Your component HTML :

<h1>CDM Student</h1>
<div *ngFor="let user of users">
   {{user.first_name}}  {{user.last_name}}
</div>code here

Also in your API http://localhost:3000/api/users , you shouldn't return the PASSWORD in the JSON (be very careful with this kind of information)

Upvotes: 4

Karim Khan
Karim Khan

Reputation: 91

your Code is ok . just add angular json pipe. Have you seen https://angular.io/api/common/JsonPipe

The Component's HTML

<h1>CDM Student</h1>
<div *ngFor="let user of users">
   {{user | json}}
</div>code here

maybe it's helpful for you . Thank you

Upvotes: 3

Related Questions