Error creating click event in shopping cart Angular + primeNg

Question

When creating the click event in the shopping cart, it gives an error when inserting the function parameter: "onDelete(cartItem)" I don't understand why the problem. can you help me? Thanks!

CART-COMPONENT.HTML

<button pButton pRipple type="button" label="Remove"class="p-button-danger (click)="onDelete(cartItem)" p-button-text" ></button>

CART-COMPONENT.TS

  onDelete(cartItem: CartItem) {
    this.cartService.remove(cartItem);
  }

CART.SERVICE

  remove(cartItem: CartItem) {
    const itemIndex = this.cartItems.findIndex(tempCartItem => tempCartItem.id === cartItem.id);

    if (itemIndex > -1) {
      this.cartItems.splice(itemIndex, 1);
      this.computeCartTotals();
    }
  }```




I tried to remove the parameter but the error persists.

Answer 1

Because you are not giving us the exact error, or even whether you are getting a compile or runtime error, I can only guess:

In your template example, there are multiple syntax errors. Your double-quote characters are in all the wrong places. So this would explain compile errors. A correct version of the template might look like this:

<button pButton pRipple type="button" 
        label="Remove" class="p-button-danger" 
        (click)="onDelete(cartItem)"
        p-button-text></button>