Here is a snippet of JSON data:
{
"StatusCode": 0,
"StatusMessage": "OK",
"StatusDescription": [
{
"pharmacy_id": "011E752345553380ABC13FFA163ECD15",
"pharmacy_name": "Pharmacy",
"lastUpdated": "2019-12-03T11:15:26.510Z",
"products": [
{
"productID": "11AA016CBEFFE8B29B46E8393535C49F",
"quantity": 1,
"product_name": "BETADINE",
"price": 10
}
],
},
{
"pharmacy_id": "011E762345552280FBC13FFA163ECD10",
"pharmacy_name": "Test Pharmacy",
"lastUpdated": "2019-12-03T13:40:55.759Z",
"products": [
{
"productID": "11BA016CBEFFE8B29B46E8393445C49F",
"quantity": 4,
"product_name": "EUCARBON",
"price": 10
},
{
"productID": "11BA016CBEFFE8B29B46E8393532C49F",
"quantity": 2,
"product_name": "ALMACINE",
"price": 10
},
{
"productID": "22BA016CBEFFE8B29B46E8393555C49F",
"quantity": 2,
"product_name": "BUPRENORFIN",
"price": 10
}
],
},
.....
]
}
I'm looking to display the product name, quantity, and price in the view.
The code below retrieves the data from an API:
public items: Receta;
getall() {
this.WS.history().subscribe(
items => {
this.items = items;
console.log('itemsssssssssssssss', items) // show JSON
console.log('itemsssssssssssssss.products', items.products) // show undefined
},
err => console.error('err', err),
() => console.log('error')
);
}
In the HTML file, only the pharmacy names are currently being displayed, but I would like to include products for each pharmacy as well.
<StackLayout *ngFor="let item of items; let i = index;" padding="10">
<GridLayout columns="*" rows="auto" style="padding: 10%;">
<Label [text]="item .pharmacy_name" class="list-group-item-heading"
style="width: 60%; font-size: 14px; text-align: left;" row="0" col='0'
horizontalAlignment="left"></Label>
</GridLayout>
</StackLayout>
If you have any suggestions on how to display both pharmacies and their respective products in the view, please share!