Question

我有一个由滑动物品组成的产品清单。我的离子项选项如下;

<ion-item-options>
              <button ion-button color="danger" (click)="decreaseAmount(product.id)">
              <ion-icon name="md-remove"></ion-icon>
                </button>

              <ion-input disabled="true" id="amount" class="amount" type="number" [value]="product.amount"></ion-input>

              <button ion-button color="secondary" (click)="increaseAmount(product.id)">
              <ion-icon name="md-add"></ion-icon>
              </button>

              <button (click)="addToCart()" ion-button color="secondary">
              <ion-icon name="md-checkmark"></ion-icon>
              </button>

      </ion-item-options>

基本上，按钮用于增加或减少产品数量。但是，当我单击其中一个按钮来更改金额时，滑动项目会自行关闭。我该如何防止这种情况？

Answer 1

将$ event添加到操作方法：

<强> HTML

....decreaseAmount($event, product.id)...

类别：

decreaseAmount(event, id){
  event.stopPropagation();
  .... // as before
}

这将阻止冒泡

按钮单击离子项选项时如何防止离子滑动项自动关闭？

1 个答案: