Ionic 2列表避免滚动时意外点击
Ionic 2 list avoid accidental click while scrolling
在iOS 10设备的以下联系人列表中,在无限滚动angular2+Meteor+Ionic2应用程序时,多次触发点击事件并显示联系人详细信息页面。
<ion-content class="contacts-page-content">
<ion-list>
<button ion-item *ngFor="let contact of contacts | async" (click)="showContactDetails(contact)" text-wrap class="contacts">
<ion-avatar item-left>
<img[src]="contact.picture">
</ion-avatar>
<h2 class="contact-name">{{contact.firstName}} {{contact.lastName}}</h2>
<h4 ion-text color="grayText">{{contact.jobTitle}}</h4>
<h3 class="contact-supplier" *ngIf="contact.supplierName">{{contact.supplierName}}</h3>
</button>
</ion-list>
<ion-infinite-scroll (ionInfinite)="pullMoreContacts($event)">
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="Loading more contacts...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
有没有办法避免滚动时的点击?非常感谢任何帮助。
谢谢。
检查 here ionic 2 手势。
尝试
(tap)=showContactDetails(contact)
而不是点击。
在iOS 10设备的以下联系人列表中,在无限滚动angular2+Meteor+Ionic2应用程序时,多次触发点击事件并显示联系人详细信息页面。
<ion-content class="contacts-page-content">
<ion-list>
<button ion-item *ngFor="let contact of contacts | async" (click)="showContactDetails(contact)" text-wrap class="contacts">
<ion-avatar item-left>
<img[src]="contact.picture">
</ion-avatar>
<h2 class="contact-name">{{contact.firstName}} {{contact.lastName}}</h2>
<h4 ion-text color="grayText">{{contact.jobTitle}}</h4>
<h3 class="contact-supplier" *ngIf="contact.supplierName">{{contact.supplierName}}</h3>
</button>
</ion-list>
<ion-infinite-scroll (ionInfinite)="pullMoreContacts($event)">
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="Loading more contacts...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
有没有办法避免滚动时的点击?非常感谢任何帮助。
谢谢。
检查 here ionic 2 手势。 尝试
(tap)=showContactDetails(contact)
而不是点击。