Sandeep Sharma
Sandeep Sharma

Reputation: 1885

Continuous clicking on ion-icon not working on IOS

Continuous clicking on ion-icon does call decrementQty() method multiple times on IOS while it is working on Android.

<ion-icon qty-icons  name="remove" (click)="decrementQty()">

Problem: If I click multiple times on the icon-icon, decrementQty() does not get called.

Expected: decrementQty() should be called multiple times with click events as on Android.

how can I achieve the same on IOS?

Upvotes: 0

Views: 1192

Answers (1)

Andreas Gassmann
Andreas Gassmann

Reputation: 6544

There are 2 possible issues:

  1. If you add the click handler directly to the ion-icon element, the hitbox could be only the actual icon itself, which makes it hard to click. The easiest way to solve this would be to wrap it in a button.

  2. IOS has a click delay of 300ms on every element except a few (<a> and <button> elements, maybe more). Ionic provides a directive called tappable to remove this delay. <ion-icon tappable qty-icons name="remove" (click)="decrementQty()">

All in all my suggestion would be to wrap the icon in a button and add the click handler there.

Upvotes: 1

Related Questions