I just created a new project with sidemenu, and I created the a listview using ion-infinity-scroll. When move to the page position within distance 1%, the on-infinite method will be kept on calling and the list will not be appended any new item. ( I used the exactly same code with Beta 13, it was working )
The exact same code was working in beta 13 for me. (Except for the use of AngularJS 1.3 bind once natively. However I tried the same code without :: and it still didnāt work)
Is change ā$scope.$broadcast(āscroll.infiniteScrollCompleteā);ā to ā$scope.$apply(function(){ $scope.$broadcast(āscroll.infiniteScrollCompleteā); });ā?
But it doesnāt work. The number of my listās items is really changed, but they donāt show out.
Just like what you said: āthe on-infinite method will be kept on calling and the list will not be appended any new itemā.
I also tried this but the infinite-scroll-event is still triggered (infinite) multiple times! My code looks exactly the same like from kekijk. Are there any other solutions to fix this? Thanks!
Hmm, isnāt this flag only needed if there are really no new products left on the server?
I basically want to fetch new products from the server when the user scrolls down, update the list and when the user scrolls down to the bottom, load the next products (repeat this steps until really no products are left and THEN set noMoreItemsAvailable flag to true)
How I use this flag is that, letās say I load 100 records from server, and only display 10 records on the list each time,
when I scroll more than 10 record on the list, then loadmore() triggered to load another 10 records from 11-20 out of the 100 record.
Once all 100 records are loaded to the list, then the flag stop the inifinite scroll, at the same time on the backend, I load another 100 recordsā¦ and so forth.
For those who still have this bug, I believe Iāve found a workaround. I figured this out when observing that, after triggering a cycle of infinite scroll, if I scrolled the scroll view, the infinite scrolling would stop. Iām guessing this is a bug n beta14 of ionic where some information that the infinite scrolling is using isnāt being properly updated. That is to say, without explicitly scrolling the scroll view, it still thinks youāre currently scrolled to the bottom even though more content has been loaded. You can even see that the scroll indicator on the right continues to render as though no new content has been added to the view, at least not until you explicitly scroll the scroll view.
So hereās the work around. Some time after calling:
However, the problem with the second call immediately following the first is that any momentum scrolling or bounce animation will be interrupted, and all scrolling will cease. So in order to get it to work, I introduced a delay between when a āload moreā cycle concludes and when the infinite scrolling is allowed to happen again.
$scope.canInfiniteScroll = false;
SomeService.getInitialData(...).then(function(data)) {
....
$scope.canInfiniteScroll = true;
});
$scope.loadMore = function () {
$scope.canInfiniteScroll = false;
$scope.$broadcast('scroll.infiniteScrollComplete');
SomeService.getMoreData(...).then(function(data) {
if (< more data to load >) {
$timeout(function () {
$ionicScrollDelegate.$getByHandle('myScrollDelegateHandle').scrollBy(0, 0);
$scope.canInfiniteScroll = true;
}, 1000);
});
}
}
$scope.moreDataCanBeLoaded = function () {
return $scope.canInfiniteScroll;
};
That seems to do the trick. Scrolling animation is preserved, and the infinite scroll infinite loop is stopped. Hopefully this works for others too! And also hopefully this bug gets fixed in ionic beta 15
