Increment and decrements item quantity based on id


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?

can any one help on this

<div class="list">
    <ion-item *ngFor="let list of quickOrder; let i = index">
        <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 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>
<div class="addtocart">
  <center><button padding (click)="addToCart();">Add to Cart</button></center>

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

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

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

// decrement product qty
decrementQty() {
if(this.qty-1 < 1 ){
this.qty = 1
this.qty -= 1;

this for .ts file


Didn’t we just cover this yesterday?.

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

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


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

selector: 'page-cart',
templateUrl: 'cart.html',
export class CartPage implements OnInit {



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

//decrements item

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

1 Like


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.


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