user6579134
user6579134

Reputation: 839

infinite scroll clears existing data before adding new data unto page

I'm working on an ionic project which contains infinite scrolling. When users scroll to the bottom of the page it loads up older posts by first clearing up what existed on the page except for it.

Controller

app.controller('feedsctrl', ['$scope', '$http', function($scope,$http) {
    $scope.posts = [];
    $scope.page=0;
    $scope.loadmore = function() {
        $http.get('http://localhost/app/news.php?page='+$scope.page).success(function(data) {
            console.log(JSON.stringify(data));
            var i = data.length;
            $scope.posts = data;
            $scope.posts.push(data);
            $scope.$broadcast('scroll.infiniteScrollComplete');
            //console.log($scope.page);
            $scope.page +=1;
        });
    };
}]);

HTML

<div ng-controller="feedsctrl" class="list card" ng-repeat="item in posts track by $index">
{{item.fullname}}<br>
{{item.username}}
</div>

Upvotes: 0

Views: 241

Answers (1)

Ujjwal kaushik
Ujjwal kaushik

Reputation: 1686

.controller('feedsctrl',['$scope','$http',function($scope,$http){
  $scope.posts = [];
  $scope.page=0;
  $scope.loadmore = function() {
    $http.get('http://localhost/app/news.php?page='+$scope.page).success(function(data) {
      for(var i=0;i<data.length;i++){
      $scope.posts.push(data[i]);
      }
      $scope.$broadcast('scroll.infiniteScrollComplete');
      //console.log($scope.page);
      $scope.page +=1;
    });
  };
}])

You are assigning data into $scope.posts before pushing it .You shouldn't be

Thanks

Upvotes: 1

Related Questions