Question

我正在尝试使用离子框架实现离子无限滚动，我有一个REST API，允许我设置索引以获取请求范围..我的服务看起来像这样，其中start in end是索引

this.GetUserRatings = function (id, begin, end) {
            return $http.get($rootScope.endPoint + '/user/' + id + '/ratings/'+ begin + '/' + end);
        };

当页面重新加载时，我想在列表中有10个项目，所以在我的控制器中它会像这样......

 UserService.GetUserRatings($stateParams.id, 1, 10)
        .success(function (data) {
          $scope.userRatings = angular.fromJson(data);
          }).error(function(error) {
                    //do something
        });

当我向下滚动列表时，我希望我的离子无限卷轴能够获得接下来的10个项目（11 - 20）和下一个项目（21 - 30），依此类推。那么我该怎么做？ / p>

$scope.loadMore = function() {

   // UserService.GetUserRatings($stateParams.id, ?, ?)
   // $scope.ratings.push({...}); I'm guessing this will be in the success 
   //also how to know if no more results
    $scope.$broadcast('scroll.infiniteScrollComplete'); 
  };

  $scope.ratings = [];

在视图中它是这样的..

 <ion-infinite-scroll ng-if="noMoreResults" on-infinite="loadMore()" distance="10%"></ion-infinite-scroll>

Answer 1

基本上，您正在更新$scope.userRatings，因此我会使用包含以下内容的内容：

首先获得下一个项目
然后将这些项目添加到您的列表中。请注意，我建议使用合并方法但没有关于数据结构的更多信息，很难提出合适的建议。
我不知道如何将noMoreResults设为true，但您可能知道何时将其实例化;）

 var _loopItems = 10;
 $scope.loadMore = function() {
   var _curLength = $scope.userRatings.length;

   UserService.GetUserRatings($stateParams.id, _curLength  , _curLength  + _loopItems ).success(function (data) {
      $scope.userRatings = angular.merge($scope.userRatings, angular.fromJson(data)); // AS I DON T KNOW YOUR DATAS, IT S HARD TO TELL HOW TO MERGE THOSE VALUES
      }).error(function(error) {
                //do something
    });

    $scope.$broadcast('scroll.infiniteScrollComplete'); 
  };

编辑：正如你的回答是这样的：

[{id:1, userid:1, rating_num:5, rating_text:"foo"},{id:2, userid:2, rating_num:5, rating_text:"foo"}]

我建议用下面的内容更改合并：

data = angular.fromJson(data);
for (var i =0; i< data.length; i++){
  $scope.userRatings.push(data[i]);
}

AngularJS Ionicframework无限滚动GET一次请求一个列表10

1 个答案: