Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

bug: Ionic Refresh & Infinite scroll in the same page doesn't work infinite scroll .

See original GitHub issue

Bug Report

Ionic version: [x] 4.x

Current behavior: If I have Ionic Refresh & Infinite scroll in the same page. The infinite scroll will not work. Keeps showing the first page.

If I remove the <ion-refresh> the infinite scroll works, but I can’t refresh the page

Expected behavior: Be able to use both components in the same page.

Steps to reproduce:

Have ion-refresher & ion-infinite-scroll in the same page

Related code:

html

 <ion-refresher slot="fixed" (ionRefresh)="loadAll($event)">
    <ion-refresher-content>
      {{loading }}
    </ion-refresher-content>
  </ion-refresher>

   <ion-infinite-scroll threshold="20%" (ionInfinite)="loadMore($event)"  >
    <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading...">
    </ion-infinite-scroll-content>
  </ion-infinite-scroll>

ts.

loadMore(event) {
    this.page++;
    this.loadAttended(event);
  }

loadAll(event?) {
    this.loading = 'Loading ...';
    if (!this.alertAttended) {
      this.loadNotAttended(event);
    } else {
      if (this.alertAttended === 'alertAns') {
        this.resetLoadAttended(event);
      } else {
        this.loadNotAttended(event);
      }
    }
  }

Other information:

Ionic info:

Ionic:

   Ionic CLI                     : 5.4.14 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.11.6
   @angular-devkit/build-angular : 0.803.25
   @angular-devkit/schematics    : 8.3.20
   @angular/cli                  : 8.3.20
   @ionic/angular-toolkit        : 2.1.1

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.1.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 13 other plugins)

Utility:

   cordova-res (update available: 0.9.0) : 0.8.1
   native-run                            : 0.3.0

System:

   Android SDK Tools : 26.1.1 (/Users/mirg/Library/Android/sdk)
   ios-sim           : 8.0.2
   NodeJS            : v12.14.1 (/usr/local/Cellar/node@12/12.14.1_1/bin/node)
   npm               : 6.13.4
   OS                : macOS Catalina
   Xcode             : Xcode 11.3.1 Build version 11C504


  ─────────────────────────────────────────────────

     Ionic CLI update available: 5.4.14 → 5.4.16
            Run npm i -g ionic to update

  ─────────────────────────────────────────────────

Issue Analytics

State:
Created 4 years ago
Comments:5 (2 by maintainers)

Top GitHub Comments

1reaction

MInesGomescommented, Mar 10, 2020

@liamdebeasi I am really sorry for bothering. This code is also working on my samsung 9. Maybe is something else in my own code.

0reactions

ionitron-bot[bot]commented, Apr 9, 2020

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.