如何在Ionic 3中实现完整的购物车系统?

时间:2018-04-10 07:41:22

标签: angular firebase ionic-framework cart

您好我刚刚在https://www.joshmorony.com/add-to-cart-with-the-web-animations-api-in-ionic/教程后创建了一个购物车系统。我可能会犯一些愚蠢的错误,或者我的逻辑可能是错的。当我多次添加相同的产品/在对象中创建另一个元素而不是仅修改该特定元素的数量时。请帮忙..这是我的Home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { ListPage } from '../list/list';

@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {

items : Object[] = [];
itemsInCart: Object[] = [];

constructor(public navCtrl: NavController) {

this.items = [
{ 'name': 'Hello World', quantityInCart: 0 , id: 1},
{ 'name': 'Hello1 World', quantityInCart: 0 , id: 2},
{ 'name': 'Hello2 World', quantityInCart: 0 , id: 3},
{ 'name': 'Hello3 World', quantityInCart: 0 , id: 4}
];
}

addToCart(item) {
item.quantityInCart += 1;
this.itemsInCart.push(item); 
console.log(this.itemsInCart);

localStorage.setItem('cart', JSON.stringify(this.itemsInCart));
}

goToList() {
this.navCtrl.push(ListPage);
}

}

enter image description here

enter image description here

我希望输出为

[{…}]0: {name: "Hello World", quantityInCart: 2, id: 1}

由于

0 个答案:

没有答案