这是我的项目,逻辑是这样的,右边显示的是产品列表,按加会判断是否已经有加入购物车,有就增加数量,没有就创建一条记录。
页面刷新时,如何将产品列表和用户的购物车进行匹配?
<ion-header>
<ion-navbar>
<ion-title>产品列表</ion-title>
<button ion-button menuToggle end>
<ion-icon name="menu"></ion-icon>
</button>
</ion-navbar>
</ion-header>
<ion-content>
<p class="left-list">
<ion-list >
<button ion-item *ngFor="let category of categories" (click)="getItems(category)" [class.active]="category==selectCategory">
{{ category.name }}
</button>
</ion-list>
</p>
<p class="right-content">
<ion-list>
<ion-item *ngFor="let item of items">
<ion-thumbnail item-left *ngIf="item.image">
<img src="{{item.image}}">
</ion-thumbnail>
<h2>{{item.name}}</h2>
<p>{{item.text}}</p>
<p class="input-group">
<button ion-button round>-</button>
<input type="number" [(ngModel)]="item.cart.number || 0" >
<button ion-button round (click)="itemInc(item)">+</button>
</p>
</ion-item>
</ion-list>
</p>
</ion-content>
我目前的逻辑是,关联出来用户的这个产品的在购物车的记录,有记录item.cart.number
,就显示,没有就显示0,结果一大堆错误。。。。
这应该是做一个顺手数据结构的问题。
列表的结构是后端给你的不需要转换,先查分类再查分类对应的产品即可。
购物车需要单独做个变量对象(map),key是产品id,value是数量,在模板里直接访问对应的数量即可。