2017-02-23 5 views
1

iOS 10 장치의 다음 연락처 목록에서 무한 스크롤하는 angular2 + Meteor + Ionic2 앱을 수행하는 동안 click 이벤트가 여러 번 발생하고 연락처 세부 정보 페이지가 표시됩니다.이오니아 2 목록은 실수로 클릭하는 것을 방지합니다.

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

스크롤하는 동안 피할 수있는 클릭이 있습니까? 어떤 도움이라도 대단히 감사합니다.

감사합니다.

답변

2

이온 2 제스처에 대해서는 here을 확인하십시오. 대신 클릭의

(tap)=showContactDetails(contact)

을 시도 .

+0

(탭)을 제공해 주셔서 감사합니다. 실수로 인한 클릭 수가 감소했습니다. 그러나 몇 번의 무한 스크롤 후에도 연락처 세부 정보 페이지가 탭없이 표시됩니다. 진행 중 스크롤하는 동안 탭을 사용 중지하거나 클릭하는 방법이 있습니까? – annadurai

+0

시도해 보셨습니까 event.stoppropagation() ;? –

+0

당신의 모든 도움 Suraj에게 고마워요. 나는 (탭) = "showContactDetails (연락처); $ event.stopPropagation();"시도했습니다. 탭을 사용하지 않는 것으로 보이고 연락처 세부 정보 페이지가 표시되지 않습니다. 또한 showContactDetails 함수에서 return false를 추가하려고 시도했습니다. 그러나 그것은보고 된 문제를 해결하지 못합니다. 신고 된 문제는 Android 기기에서 테스트 할 때 발생하지 않습니다. 너가 나에게 시험해보기를 바라는 다른 고치? – annadurai