Ionic 2列表避免在滚动时意外点击

时间:2017-02-23 06:31:16

标签: ionic2 vertical-scrolling ios10.2

在iOS 10设备的以下联系人列表中,在进行无限滚动angular2 + Meteor + Ionic2应用程序时,很多时候会触发click事件并显示联系人详细信息页面。

  <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>

是否可以避免滚动时的点击?非常感谢任何帮助。

感谢。

1 个答案:

答案 0 :(得分:2)

检查here是否有离子2手势。 试试

(tap)=showContactDetails(contact)

而不是点击。