每种产品的离子2增量减量

Question

所以我想为每个产品输入数量，但每次点击增量按钮，其他产品也会增加，如何增加产品数量而不影响另一个？此外，我想通过将其数量乘以价格来计算应付金额，我应该如何做？

[![enter image description here][2]][2]

Answer 1

在您的组件代码中，首先为quantity

中的每个product初始化productlist属性

// After getting the list of products...
this.productlist.foreach(product => { product.quantity = 0; });
// ...

同时更新decrement和increment函数以接收应修改的product：

increment(product: any) {
  product.quantity++;
}

decrement(product: any) {
  if(product.quantity > 0) {
    product.quantity--;
  }
}

现在，在视图中，您可以使用新的quantity属性来显示数量乘以价格。另请注意，现在我们已将product发送到increment和decrement个功能：

<ion-icon ... (click)="decrement(product)"></ion-icon>
{{ product.quantity * product.PPrice }}
<ion-icon ... (click)="increment(product)"></ion-icon>

Answer 2

<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);
}
}

}