Why it's adding the quantity of my item? My Method is adding it when it's not supose to do that

Question

I have this project in angular, it's an online store, but I don't know why every time I click the button "agregar a carrito" (add to cart in Spanish) the quantity of my item's increase.

ts.

removeItem(item: iProduct) {
    if (item.quantity > 0) {
      item.quantity--;
    }
}
addItem(item: iProduct) {
    item.quantity++;
}
/////// In this two methods add the same quantity to the item 1 -> 2 -> 4 -> 8... 
addToCart(item: iProduct) {
    if (item.quantity > 0) {
      this.cartService.broadcastData(item);
    }
}

buyNow(item: iProduct) {
    if (item.quantity > 0) {
      this.cartService.broadcastData(item);
    }
}

Html

<div class="col-4 single-item-display" *ngFor="let product of products">
  <img src="{{ 'assets/img/' + product.img + '.jpg' }}" />
  <div class="item-description">
    <span>{{ product.name }}</span>
    <span>{{ product.price }}$</span>
    <div class="add-remove-item">
      <a (click)="removeItem(product)">
        <fa-icon [icon]="remove"></fa-icon>
      </a>
      ////////////////This is the quantity that is not supose to increase with those buttons
      {{product.quantity}}
      <a (click)="addItem(product)">
        <fa-icon [icon]="add"></fa-icon>
      </a>
    </div>
    /////////This is are the buttons that are not working correctly
    <a class="add-to-cart" (click)="addToCart(product)">
        Agregar a carrito
    </a>
    <a class="buy-now" style="margin-top: 10px;" (click)="buyNow(product)">
        Comprar
    </a>
  </div>
</div>

this is my service to communicate components

srcItem = new Subject<iProduct>();
srcItem$ = this.srcItem.asObservable();

constructor() { }

broadcastData(product: iProduct): void {
  this.srcItem.next(product);
}

and in my cart component, I subscribe to it and push the value to an array

productsInCart: iProduct[] = []
total: number = 0;
constructor(private cartService: CartService) {
cartService.srcItem$.subscribe(rsp => {
  let existProduct = this.productsInCart.find(x => x.productCode === rsp.productCode);
  if (existProduct) {
    this.productsInCart.find(x => x.productCode === rsp.productCode).quantity += rsp.quantity;
  }
  else {
    this.productsInCart.push(rsp);
  }
  this.productsInCart.forEach(product => {
    this.total += (product.price * product.quantity)
  })
})
}

I just want to send the item and its quantity to another component, I just don't understand why in this component every time I click it adds them.

Let's say I click the button addItem to increase the quantity to 1, then I click the "addToCart" Button, it sends it, but if click it again the quantity in this screen goes to 2, if click it again to 4, and so on

Answer 1

In this line:

this.productsInCart.find(x => x.productCode === rsp.productCode).quantity += rsp.quantity;

you double the quantity of the product.