2017-07-18 75 views
2

我已使用ion-tab来显示页面(inboxitem),其中包含ion-list并使用ion-infinite-scrollIonic 2-无限滚动不在第二次滚动调用方法

我在inboxitem.html

<ion-content class="inbox can-swipe-list"> 
    <ion-list> 
     <ion-list-header> 
      <ion-select [(ngModel)]="selectedOption" [selectOptions]="filterOptionSettings" (ngModelChange)="getFilteredList()"> 
       <ion-option value="{{option.value}}" *ngFor="let option of listInboxFilterOptions; let i=index" [selected]="i==0">{{option.name}}</ion-option> 
      </ion-select> 
     </ion-list-header> 

     <ion-item-sliding *ngFor="let list of inboxList; let j=index"> 
      <ion-item class="listWithReason" tappable (click)="ViewPopupDetails(j)"> 
       <h2> 
        <span>{{list.fullname | filterpipes:'manipulatename'}}<br /><small>{{list.leavename}}</small></span> 
        <div> <ion-icon md="md-calendar" ios="md-calendar"></ion-icon> {{list.fromdate}}{{list.todate!=null ? " to ":" " }}{{list.todate}}</div> 
       </h2> 
       <p *ngIf="list.reason!=''">{{list.reason}}</p> 
      </ion-item> 

      <ion-item-options side="right" *ngIf="list.empphone=='' || list.empphone==null"> 
       <button ion-button color="grey" class="no-phone">No phone</button> 
      </ion-item-options> 
     </ion-item-sliding> 

     <ion-item class="item-empty-row" *ngIf="!inboxList.length > 0"> 
      {{noRecordsFound}} 
     </ion-item> 
    </ion-list> 

    <ion-infinite-scroll *ngIf="infiniteLoading" (ionInfinite)="loadInboxList(false)" distance="1%"> 
     <ion-infinite-scroll-content></ion-infinite-scroll-content> 
    </ion-infinite-scroll> 
</ion-content> 

问题

  1. 下面的代码默认20条记录加载
  2. 在滚动加载20个。
  3. 但在第二次滚动时,它只显示旋转动画,但不加载任何记录。也就是说,在第二次滚动时,它根本不叫loadInboxList方法。所以清楚的是它在loadInboxList方法中没有错,因为它在第二次滚动时根本没有被调用。

我离子和科尔多瓦版本

Ionic Framework: 3.5.0 
Ionic App Scripts: 1.3.9 
Angular Core: 4.1.3 
Angular Compiler CLI: 4.1.3 
Node: 6.10.3 

任何帮助将高度赞赏

回答

2

,请务必让infiniteScroll.complete();你的loadInboxList()中的

如果您有任何机会在代码中调用infiniteScroll.enable(false),这将阻止滚动在任何后续滚动上工作,直到您再次启用滚动。

编辑

现在我注意到您没有传递您的(ionInfinite)方法的事件 -

它应该是这样的:

(ionInfinite)="loadInboxList($event)" 

,并在您的.ts

loadInboxList(infiniteScroll){ 
    ...your code 
    infiniteScroll.complete() 
} 
+0

这真是愚蠢的我,愚蠢的错误。谢谢 – WatsMyName

+0

不客气! –