我对自己的代码有疑问。我有这个JSON:
购物车
[
{
"_id": "5d2c9123fc70b57e44ec7924",
"userid": "11E76234942299FCC13FFA163EDC2079",
"dateCreated": "2019-07-15T14:43:47.282Z",
"deleted": 0,
"purchased": 0,
"products": [
{
"productID": "2",
"price": "100",
"quantiy": "3"
},
{
"productID": "3",
"price": "100",
"quantiy": "1"
},
{
"productID": "14",
"price": "100",
"quantiy": "1"
}
]
}
]
我正在从此函数获取JSON:
getcart() {
this.ws.getCart().subscribe(
cart => {
this.cart = cart;
console.log('cart', cart)
},
err => console.error('error', err),
() => console.log('error')
);
}
现在,我想在视图中显示products
,为此,我用html编写了这段代码:
<ListView row="1" class="list-group" [items]="cart" style="height:1250px">
<ng-template let-shop="item">
<FlexboxLayout flexDirection="row" class="list-group-item">
<StackLayout height="100%">
<Label [text]="shop._id"></Label>
<Label [text]="shop.userid"></Label>
<Label [text]="shop?.products"></Label>
</StackLayout>
</FlexboxLayout>
</ng-template>
</ListView>
我得到的观点:
答案 0 :(得分:2)
Products也是一个数组,您需要对其进行迭代。尝试类似
<Label *ngFor="let product of shop.products" [text]="[product.id, product.userid, product.quantity].join()"></Label>
答案 1 :(得分:0)
尝试以下操作:-
<ListView [items]="items" class="list-group">
<ng-template let-shop="item" let-i="index">
<FlexboxLayout flexDirection="row" class="list-group-item">
<StackLayout orientation="horizontal">
<Label [text]="shop._id" marginRight="5" style="color:red"></Label>
<Label text="->" style="color:#000000"></Label>
<Label *ngFor="let product of shop.products" textWrap="true" text="{{ product.productID +'\n'+ product.price +'\n'+ product.quantiy }}"></Label>
</StackLayout>
</FlexboxLayout>
</ng-template>
</ListView>