Tappable Attribute: Ionic 2

Advertisement:

It is recommended to use click event only on clickable elements like button or/and on anchor tags. If you use click event on any other tags(apart from button or anchor tag) there will be some kind of jerkiness or delay of 300 milliseconds.

Related Read:
Passing Data Between Pages: Ionic 2

Tappable Attribute: Ionic 2



YouTube Link: http://www.youtube.com/watch?v=d1DzlKu6sUQ [Watch the Video In Full Screen.]



src/home/home.html

  < ion-list>
    < ion-item *ngFor="let Company of companies" 
              (click)="detailsPage(Company.code);" tappable>
      {{Company.name}}
    < /ion-item>
  < /ion-list>

Solution
Add tapabble attribute if you’re using click event on elements other than button or an anchor tag. In our example we are using click event on ion-item element, so adding tapabble attribute would speed up the firing of click event by 300 milliseconds.

In today’s performance centric application development 300 milliseconds delay shouldn’t be neglected. Hope this small tip helps in improving the usability of your mobile application.

4 thoughts on “Tappable Attribute: Ionic 2”

Leave a Reply

Your email address will not be published. Required fields are marked *