2017-07-18 9 views
2

私はion-tabを使用してion-listを含むページ(inboxitem)を表示し、ion-infinite-scrollを使用しています。Ionic 2 - 無限スクロールで2番目のスクロールが呼び出されない

私は20件のレコードが、それは20以上をロードし、スクロールで
  • をロードされます。デフォルトでは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> 
    

    PROBLEM

    1. 内のコードを次している

    2. しかし、2番目のスクロールでは回転するアニメーションだけが表示されますが、レコードはロードされません。つまり、2回目のスクロールでは、loadInboxListメソッドはまったく呼び出されません。だから、その明確なことは何も間違ってloadInboxListメソッドでは、それは2番目のスクロールではまったく呼び出されないためです。

    マイイオンとコルドバのバージョン

    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)を呼び出すと、再度有効にするまでスクロールが後続のスクロールで機能しなくなります。

    EDIT

    今私はあなた(ionInfinite)メソッドでイベントを渡していない気づいた -

    それは次のようになります。

    (ionInfinite)="loadInboxList($event)" 
    

    とあなた.TSで

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

    私の愚かなことは、愚かな間違いです。おかげで – WatsMyName

    +0

    ようこそ! –

    関連する問題