使用Angular 6 ngFor,与其他数据数组相比,如何更改某些内容?

使用Angular 6 ngFor,与其他数据数组相比,如何更改某些内容?,angular,angular-directive,angular-template,Angular,Angular Directive,Angular Template,我正在创建购物车。我有产品数据的对象数组和购物车项目数据数组。我尝试构建购买物品的按钮,有条件按钮,如果购物车数据中的同一产品需要按Id显示“+3-”数量来自购物车数据,如果产品不在购物车中,则只需显示“购买”按钮。我已经实现了这个相关的问题 我试图解决以下问题: 管 trackBy, 尝试更改产品数组数据映射,并将返回值与购物车数据进行比较这是为了尝试获取解决方案,但我无法。在这里,bu使用管道可能会因复杂性n*2而出现一些问题。 所以,寻找解决方案,以减少复杂性,至少解决这个问题。如果可能的

我正在创建购物车。我有产品数据的对象数组和购物车项目数据数组。我尝试构建购买物品的按钮,有条件按钮,如果购物车数据中的同一产品需要按Id显示“+3-”数量来自购物车数据,如果产品不在购物车中,则只需显示“购买”按钮。我已经实现了这个相关的问题

我试图解决以下问题:

管 trackBy, 尝试更改产品数组数据映射,并将返回值与购物车数据进行比较这是为了尝试获取解决方案,但我无法。在这里,bu使用管道可能会因复杂性n*2而出现一些问题。
所以,寻找解决方案,以减少复杂性,至少解决这个问题。如果可能的话,注意复杂性。

我想我理解你的问题,这就是你想要的吗

在第二天,TS从stackblitz复制了它

 export class AppComponent {
      products :product[]= [
        { name: 'Radio', price: 34, _id: '12345' },
        { name: 'TV', price: 44, _id: '12346' },
        { name: 'Bascket', price: 16, _id: '12347' },
        { name: 'Banana', price: 4, _id: '12348' },
        { name: 'Bike', price: 5000, _id: '12349' },
        { name: 'Toast', price: 5, _id: '12350' },
        { name: 'Shirt', price: 17, _id: '12351' }
      ];
    isCart (id){
    return this.cart.findIndex((x)=>x._id == id)>=0;
    }
    quantity(id){
    return this.cart.find((x)=>x._id == id).quantity;
    }
    buy(prod:product){
  if(this.cart.findIndex((x)=>x._id == prod._id)<0){
this.cart.push({name:prod.name,price:prod.price,_id:prod._id,quantity:1})
  }else{ 
let prod1 = this.cart.find((x)=>x._id == prod._id);
prod1.quantity +=1;
  }

}
      cart = [
        { name: 'Radio', price: 34, _id: '12345', quantity: 5 },
        { name: 'Toast', price: 5, _id: '12350', quantity: 1 },
      ]
    }
    export interface product{
    name:string;
    price:number;
    _id:string;
    }
和HTML格式:

<label *ngFor="let item of products">
  <span>
      <p>Name: {{item?.name}}, Price: {{item?.price}}</p>
  </span>
  <button  (click)="buy(item)">
    <span>{{isCart(item._id)?quantity(item._id)+'-':'Buy'}} 
  </span>
  </button>
</label>

谢谢你的帮助。我不确定它是否有助于当它添加更多的项目和购物车项目数据刷新。您能否建议对数据进行动态更改的方法,如添加一个或多个数据后刷新购物车项目数据,并且不应重新加载页面。对于静态数据,您的方法工作得很好。我尝试用数据进行动态更改。如果问题我会告诉你。@ VikasKumar,我改变了代码,你现在可以把项目添加到汽车。你有没有考虑到你的解决方案的复杂性?因为我正在寻找复杂度较低的解决方案。请阅读-总结是,这不是一种理想的解决志愿者问题的方法,并且可能会对获得答案产生反作用。请不要将此添加到您的问题中。