Ini adalah projek saya Logiknya adalah seperti berikut. Senarai produk dipaparkan di sebelah kanan .
Bagaimana untuk memadankan senarai produk dengan troli beli-belah pengguna apabila halaman dimuat semula?
<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>
Logik saya sekarang adalah untuk mengaitkan rekod pengguna produk dalam troli beli-belah Jika terdapat rekod item.cart.number
, ia akan dipaparkan jika tiada rekod, 0 akan dipaparkan daripada kesilapan. . . .
Ini sepatutnya menjadi masalah membuat struktur data yang mudah.
Struktur senarai diberikan kepada anda oleh bahagian belakang dan tidak memerlukan penukaran Cuma semak kategori dahulu dan kemudian produk yang sepadan dengan kategori.
Keranjang beli-belah perlu menjadi objek pembolehubah yang berasingan (peta) Kuncinya ialah ID produk dan nilainya ialah kuantiti Anda boleh terus mengakses kuantiti yang sepadan dalam templat.