I am working on this shopping cart module for one of my projects and this is the first time I am working on feature lie Shopping cart. Here I have a button for every item and once I click on one item I want to display the + and - buttons in order to increase/decrease the quantity for that specific item. Now what is happening in my scenario is I am able to display buttons for all items u I am failing to add a specific item, it adds all the items and if i go to remove it doesn’t do anything (It reflects all items), and quantity for that item needs to be stored/removed/updated locally. Here is my code snippets.
my .ts file
addQuantity(quantity,counter){
for (var key in this.storageValue){
if(this.storageValue[key] === quantity){
this.storageValue[key].counter += counter;
console.log(this.storageValue[key].count);
return;
}
this.counter = this.counter+1;
this.quantities.push(quantity[key]);
console.log(this.quantities.push(quantity[key]));
}
}
subQuantity(quantity,counter){
for (var key in this.storageValue){
if(this.storageValue[key] === quantity){
this.storageValue[key].counter--;
console.log(this.storageValue[key].counter--);
if(this.storageValue[key]){
}
break;
}
console.log(this.storageValue[key].counter--);
}
}
}
my html file
<ion-content>
<ion-grid *ngFor ="let displayItem of displayItemsResponse">
<p>{{displayItem.NAME}}</p>
<ion-item *ngFor ="let displayItems of displayItem?.ITEM; let i =index">
<div class = "col-md-7">
<ion-thumbnail item-start *ngIf="displayItems.PIC != '';else image">
<ion-thumbnail item-start>
<img src="{{displayItems.PIC}}">
</ion-thumbnail>
</ion-thumbnail>
<ng-template #image>
</ng-template>
<h2>{{displayItems.ITEMNAME}}</h2>
<p>Rs: {{displayItems.RATE}}</p>
</div>
<div class="col-md-5">
<div *ngIf="alive">
<ion-icon name="add-circle" (click)="addQuantity(displayItems.ITEMID)" item-right></ion-icon>
{{counter}}
<ion-icon name="remove-circle"(click)="subQuantity(displayItems.ITEMID)" item-right></ion-icon>
</div>
<div *ngIf="!alive">
<button ion-button item-end (click)="alive = !alive">Add</button>
</div>
<!-- Customisable -->
</div>
</ion-item>
</ion-grid>
</ion-content>
I am a beginner and learning Ionic. Your guidance will be appreciated.