Increment and decrements item quantity based on id

Ionic Framework ionic-v3
1

I have an app in which allows the user to increment or decrement the in-stock quantity of an item. When I click an increment or decrement button, all the items are changed at once. Only the item from the clicked row should get changed. What am I doing wrong?
image

can any one help on this

<div class="list">
    <ion-item *ngFor="let list of quickOrder; let i = index">
      <ion-row>
        <ion-col width-15>{{list.SNo}}</ion-col>
        <ion-col width-25>{{list.PartNo}}</ion-col>
        <ion-col width-25 class="add">
        <button clear (click)="incrementQty()"><ion-icon name="add-circle" ></ion-icon></button>{{qty}}
        <button clear (click)="decrementQty()"><ion-icon name="remove-circle" ></ion-icon></button>
      </ion-col>
        <ion-col width-15>{{list.Price}}</ion-col>
        <ion-col width-20><button clear (click)="delete(i)"><ion-icon name="close-circle"></ion-icon></button></ion-col>
      </ion-row>
    </ion-item>
</div>

<div class="addtocart">
  <center><button padding (click)="addToCart();">Add to Cart</button></center>
</div>

import { Component} from ‘@angular/core’;
import { NavController, Slides} from ‘ionic-angular’;

@Component({
templateUrl: ‘build/pages/titlepage/titlepage.html’,
})
export class titlePage {
qty:any;
constructor(private nav: NavController) {
this.qty = 1;
}

// increment product qty
incrementQty() {
console.log(this.qty+1);
this.qty += 1;
}

// decrement product qty
decrementQty() {
if(this.qty-1 < 1 ){
this.qty = 1
console.log(‘1->’+this.qty);
}else{
this.qty -= 1;
console.log(‘2->’+this.qty);
}
}
}

this for .ts file

2

Didn’t we just cover this yesterday?.

3 
<ion-card *ngFor="let product of cart; let index=index">

<strong> ₹ {{ item_qty *  product.price  }}</strong>

<ion-card>


import { Component, OnInit } from '@angular/core';
import {  NavController, NavParams } from 'ionic-angular';

@Component({
selector: 'page-cart',
templateUrl: 'cart.html',
})
export class CartPage implements OnInit {

 item_qty:any;

constructor()
{this.item_qty=1;}

// increment item 
inc(){
this.item_qty += 1;
console.log(this.item_qty + 1);
}

//decrements item

dec(){
if(this.item_qty-1 < 1){
  this.item_qty = 1;
  console.log('item_1->' + this.item_qty)
}
else{
  this.item_qty -= 1;
  console.log('item_2->' + this.item_qty);
}
}

}
4

hi…

I followed it… the number gets incremented and decremented but the price gets incremented when i CLick on the price add item… but it gets incremented for all the items in the grid…

can you share any snippet regarding this.

6

@ anon35626142 Thank You Very Much Your Code Is Worked For Me only // decrement product qty part :smiley: