Getting Data from JSON in ionic - json

Question

I am trying to get data from a JSON file in ionic app using.
this.http.get('https://track.delhivery.com/api/packages/json/?token=c7ac81cde31a5ea69d38cb098cab16cf7f909062&waybill=2285210000022').map(res => res.json()).subscribe(data => {
this.trackingorder = data;
console.log(this.trackingorder.ShipmentData);
But i am getting error that Shipment is undefined.
My JSON file is of the format
{
"ShipmentData": [
{
"Shipment": {
"Origin": "Bengaluru_Bomsndra_PC (Karnataka)",
"Status": {
"Status": "Delivered",
"StatusLocation": "Cjb_Kovaipudur_Dc (Tamil Nadu)",
"StatusDateTime": "2018-12-20T17:57:28.002000",
"RecievedBy": "",
"Instructions": "Delivered to consignee",
"StatusType": "DL",
"StatusCode": "EOD-38"
},
"PickUpDate": "2018-12-18T19:44:43",
"ChargedWeight": null,
"OrderType": "Pre-paid",
"Destination": "Coimbatore",
"Consignee": {
"City": "Coimbatore",
"Name": "Sayal Krishna",
"Country": "India",
"Address2": [],
"Address3": "",
"PinCode": 641105,
"State": "Tamil Nadu",
"Telephone2": "",
"Telephone1": [
"8667079713"
],
"Address1": [
"A-198,\nTamil annai street,Gandhi nagar,madukarai\nCoimbatore 641105"
]
},
"ReferenceNo": "5160",
"ReturnedDate": null,
"DestRecieveDate": "2018-12-20T07:56:22.518000",
"OriginRecieveDate": "2018-12-18T23:00:58.874000",
"OutDestinationDate": "2018-12-19T00:54:18.663000",
"CODAmount": 0,
"EWBN": [],
"FirstAttemptDate": null,
"ReverseInTransit": false,
"Scans": [
{
"ScanDetail": {
"ScanDateTime": "2018-12-18T00:33:37.614000",
"ScanType": "UD",
"Scan": "Manifested",
"StatusDateTime": "2018-12-18T00:33:37.614000",
"ScannedLocation": "BLR_Kudulu_CP (Karnataka)",
"Instructions": "Consignment Manifested",
"StatusCode": "X-UCI"
}
},
{
"ScanDetail": {
"ScanDateTime": "2018-12-20T17:57:28.002000",
"ScanType": "DL",
"Scan": "Delivered",
"StatusDateTime": "2018-12-20T17:57:28.002000",
"ScannedLocation": "Cjb_Kovaipudur_Dc (Tamil Nadu)",
"Instructions": "Delivered to consignee",
"StatusCode": "EOD-38"
}
}
],
}
}
]
}
Please help me get Shipment from this JSON file.
The exact error I am getting is
ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'Shipment' of undefined

Answer 1

It depends on which http module you are using.
For "#angular/common/http",
this.http.get('https://yourapi.com').subscribe(data => {
this.trackingorder = data;
console.log(this.trackingorder.ShipmentData);
}
For '#ionic-native/http',
this.http.get('https://yourapi.com').subscribe(data => {
this.trackingorder = JSON.parse(data);
console.log(this.trackingorder.ShipmentData);
}

Answer 2

If your using angular http then replace this line of code in your project.
change this line to
this.trackingorder = data;
Below line
this.trackingorder = data.json();
Should solve your problem. All the best.

Answer 3

I found the following method working .
Inside your .ts file use
this.http.get("https://track.delhivery.com/api/packages/json/?token=c7ac81cde31a5ea69d38cb098cab16cf7f909062&waybill=2285210000022")
.subscribe((userData) => {
console.log("shipment data" +userData);
this.users.push(userData);
});
Inside the HTML file , use the following
<div *ngFor ="let Scan of users[0].ShipmentData[0].Shipment.Scans" class="item h5">
<div *ngIf="Scan.ScanDetail.Scan=='Manifested'">
<h5 style="font-size:12px;color:black;">• {{Scan.ScanDetail.ScannedLocation}}</h5>
</div>