How can I display all values in a page using the provided JSON data?
res {
"StatusCode": 0,
"StatusMessage": "OK",
"StatusDescription": [
{
"sensors": [
{
"serial": "sensor1",
"id": "1"
},
{
"serial": "sensor2",
"id": "2"
},
{
"serial": "sensor3",
"id": "3"
}
],
"HBP_id": "12",
"HB_id": "123",
"serial_number": "hb1",
"note": "test"
}
]
}
I need to display the following in Nativescript:
serial_number: hb1
sensors : sensor1
I attempted to use the code below, but it only displays the serial number:
<StackLayout class="page">
<ListView [items]="items" class="list-group">
<ng-template let-item="item">
<Label [text]="item.serial_number"
class="list-group-item"></Label>
</ng-template>
</ListView>
</StackLayout>
Does anyone have an idea on how I can also display the sensors along with the serial number?
Thank you
Solution:
<ListView [items]="items" (itemTap)="onItemTap($event)">
<ng-template let-item="item" let-i="index" let-odd="odd" let-even="even">
<StackLayout [class.odd]="odd" [class.even]="even">
<Label [text]="item.serial_number"></Label>
<Label *ngFor="let subItem of item?.sensors" [text]="subItem.serial"></Label>
</StackLayout>
</ng-template>
</ListView>