search

ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
51.01k stars 13.51k forks source link

bug: ion-infinite-scroll´s ionInfinite event is only called once. #21314

Closed AlvaroHerrero closed 4 years ago

AlvaroHerrero commented 4 years ago

Bug Report

Ionic version: 5.1.1

Current behavior: ion-infinite-scroll´s ionInfinite event is only called once. Calling complete() on ion-infinite-scroll´s instance seems to work, but after that ionInfinite event is not called anymore.

Expected behavior: After calling complete() ionInfinite event should be enabled again.

Related Code: https://github.com/AlvaroHerrero/ionic5-infinitescroll-bug

-->

Ionic info:

Ionic:

   Ionic CLI                     : 5.4.15 (C:\Users\AHerrero\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 5.1.1
   @angular-devkit/build-angular : 0.901.6
   @angular-devkit/schematics    : 9.1.6
   @angular/cli                  : 9.1.6
   @ionic/angular-toolkit        : 2.2.0

Cordova:

   Cordova CLI       : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms : not available
   Cordova Plugins   : not available

Utility:

   cordova-res : 0.9.0
   native-run  : 0.3.0

System:

   Android SDK Tools : 26.1.1 (C:\Android\android-sdk)
   NodeJS            : v10.16.0 (C:\Program Files\nodejs\node.exe)
   npm               : 6.10.2
   OS                : Windows 10
liamdebeasi commented 4 years ago

Thanks for the issue. I am going to close this as this is not a bug in Ionic Framework. You have two issues in your code:

  1. Your page's ngFor content should not be placed in ion-infinite-scroll-content. As per the docs, this component is used to display the infinite scroll spinner: https://ionicframework.com/docs/api/infinite-scroll-content.

  2. Your page has two ion-infinite-scroll-content components inside of an ion-infinite-scroll. You only need one.

After resolving both of these issues, the reproduction you have provided now works for me.

AlvaroHerrero commented 4 years ago

Yes, it should be only one ion-infinite-scroll-content, and more important, place the content outside the ion-infinite-scroll. Thank you!

ionitron-bot[bot] commented 4 years ago

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.