How to Display JSON Response

Ionic Framework ionic-v3
1

Below is my JSON response getting from WordPress back-end
I and to print Child Name, DOB and Hobby please help me out.

id	60
date	"2017-11-30T05:57:15"
date_gmt	"2017-11-30T05:57:15"
guid	
rendered	"http://mydomain.com/med/?post_type=doctor-list&p=60"
modified	"2017-11-30T08:57:07"
modified_gmt	"2017-11-30T08:57:07"
slug	"sourav-halder"
status	"publish"
type	"doctor-list"
link	"http://mydomain.com/med/doctor-list/sourav-halder/"
title	
rendered	"Sourav Halder"
author	1
featured_media	0
menu_order	0
template	""
meta	[]
doctor-category	[]
_meta_doctor_address	"Kolkata"
_meta_doctor_mobile	"123456789"
_meta_doctor_email	"info@sourav.com"
_meta_doctor_dob	"11/27/1990"
_meta_doctor_anniversary	"11/29/2017"
_meta_wife_name	"Neha Halder"
_meta_wife_hobby	"Shopping"
_meta_wife_dob	"11/28/1992"
_meta_child_details	
0:	
child_name	"Mayank"
_meta_child_hobby	"Cricket"
child_dob	"10/23/2017"
1:	
child_name	"Dev"
_meta_child_hobby	"Hockey"
child_dob	"11/20/2017"
2

You should look at Angular HTTP guide.

Under the .subscribe() block, you can work on the returned data from HTTP call.

.subscribe(response => {
    var child_name = response.child_name;
    var child_dob = response.child_dob;
})
3

Thank yo r for your reply,

I know tell me only how to show Child Name, DOB and Hobby

_meta_child_details	
0:	
child_name	"Mayank"
_meta_child_hobby	"Cricket"
child_dob	"10/23/2017"
1:	
child_name	"Dev"
_meta_child_hobby	"Hockey"
child_dob	"11/20/2017"
]

My HTML

Name: {{ selectedDocItem.meta._meta_child_details.child_name[0] }}

4

Save your response object in a global variable. Lets say childDetails.

.subscribe(response => {
    this.childDetails = response; // Assuming that this is an object
})

Now in HTML, you can acces them like below -

<div>Child name is: {{childDetails.child_name}}</div>
<div>Child DOB is: {{childDetails.child_dob}}</div>

Look at Angular binding guide

5

I have done same thing but did not get any result, Child Name, DOB and Hobby will display in doctor details page not in list page. after click on Doctors name Child Detail will show.

_meta_child_details	
0:	
child_name	"Mayank"
_meta_child_hobby	"Cricket"
child_dob	"10/23/2017"
1:	
child_name	"Dev"
_meta_child_hobby	"Hockey"
child_dob	"11/20/2017"
]
6

Have you tried JSON.parse() function

7

tried every thing but not working only showing below data

_meta_doctor_address	"Kolkata"
_meta_doctor_mobile	"123456789"
_meta_doctor_email	"info@sourav.com"
_meta_doctor_dob	"11/27/1990"

These are still not showing

_meta_child_details	
0:	
child_name	"Mayank"
_meta_child_hobby	"Cricket"
child_dob	"10/23/2017"
1:	
child_name	"Dev"
_meta_child_hobby	"Hockey"
child_dob	"11/20/2017"
8

May i know from where this json is coming from :slightly_smiling_face:

9

Structure of returned response object is not clear to us.
Do following steps -

  1. Put a breakpoint under .subscribe(response => { }) and then do print the the response on console using console.log(response).

  2. Copy entire response printed on console and paste in you next answer. If possible, put it in formatted JSON form.

10

json is coming from below url

private url: string = ‘http://yourdomain.com/med/wp-json/wp/v2/doctor-list?filter[per_page]=-1&filter[orderby]=date&order=desc&_embed’