Solution 1 :

If userNames is correctly filled:

It should be

<p *ngFor="let user of userNames">{{user.USER_NAME}} </p>

instead of

<p>*ngFor="let user of userNames">{{user.USER_NAME}} </p>

Problem :

Iam working in an ionic project with angualar framework, where my requirement is to get the backend json data through an api call and read the JSON data in an HTML page.

Below is the code i tried

Broker api call:

http://example.com/broker/get-user-names

backend Json data:

 [

  {
"USER_NAME": "John",
"USER_COUNTRY": "USA"
},


 {
"USER_NAME": "Smith",
"USER_COUNTRY": "Canada"
 },


{
 "USER_NAME": "Peter",
"USER_COUNTRY": "Russia"
 }

 ]

In .ts page: defined an array to hold the data from the API

userNames = [];

(created a serive.ts and defined the api url there) and the function written is as follows;

   getUserNames() {
    this.apiService.getUserNames(this.apiService.loggedInUser.value.id)
     .then(res => {
     this.userNames= JSON.parse(res); 
  },
  err => {
    alert(err);
  }
)
 }

now when trying to display the content in HTML page its not showing anything

<p *ngFor="let user of userNames">{{user.USER_NAME}} </p>

this is not working. iam not understanding where iam going wrong, Please help me on this.

Thank you.

Comments

Comment posted by Shlok Nangia

are you getting the response correctly or is there some error in console??

Comment posted by Arun Mohan

It should be

{{user.USER_NAME}}

instead of

*ngFor=”let user of userNames”>{{user.USER_NAME}}

Comment posted by Shaik

Sorry, i just edited the question, even with this

{{user.USER_NAME}}

. its not working

Comment posted by Arun Mohan

Can you show the console.log of userNames after Json.parse?

Comment posted by Shaik

its not showing any thing, i even added an alert like this alert(JSON.stringify(this.userNames)); but its also not showing

Comment posted by Shaik

Sorry, i just edited the question, even with this

{{user.USER_NAME}}

. its not working

Comment posted by Arun Mohan

there should be a space

Comment posted by Shaik

its not showing any thing, i even added an alert like this alert(JSON.stringify(this.userNames)); but its also not showing

By

Leave a Reply

Your email address will not be published. Required fields are marked *