Please help with infinite scroll

ionic-v1
1

I try to use infinite scroll but … my code doesn’t work :frowning: Please, help me

part of html

<ion-view view-title="Playlists">
  <ion-content>
    <ion-list>
      <ion-item ng-repeat="item in items">
        Item {{item}}
      </ion-item>
    </ion-list>
    <ion-infinite-scroll ng-if="!noMoreItemsAvailable" on-infinite="loadMore()" distance="1%">
    </ion-infinite-scroll>
  </ion-content>
</ion-view>

and controller

.controller('PlaylistsCtrl', function($scope) {


        $scope.items = [];
        $scope.noMoreItemsAvailable = false;
        $scope.loadMore = function() {
            for(x = 0; x < $scope.playlists.length;x++){
            $scope.items.push({ title: $scope.playlists[x].title});

            if ( $scope.items.length == $scope.playlists.length ) {
                $scope.noMoreItemsAvailable = true;
            };
            $scope.$broadcast('scroll.infiniteScrollComplete');
        }};

  $scope.playlists = [
    { title: 'Reggae', id: 1 },
    { title: 'Chill', id: 2 },
    { title: 'Dubstep', id: 3 },
    { title: 'Indie', id: 4 },
    { title: 'Rap', id: 5 }]
})
2

What exactly in your code is not working? Is the function not being called? Is it stopping the loader without loading more items? We need more detail to help you out

4

When I launch my app( I`m testing in browser),this code show me all item from $scope.playlists ,without any infinite scroll effect

5

Hmm it might be that you don’t have enough items? I know you have it set to the 1 but if there is no where to scroll it might not be trigger that event. It’s possible the infinite scroll looks to see if the scroll is pulled up past the bottom of the view.

Try it with a list of maybe 100 items and see what it does?

6

I did, I tried with 50 and 100 items,but no result…
This infinite scroll doesn`t want work in loop :frowning: