Я пытаюсь реализовать ионный бесконечный прокрутки с использованием ионного фреймворка, у меня есть REST API, который позволяет мне установить индекс, чтобы получить запрос диапазона. Моя служба выглядит так, где начинаются с конца индексы.
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) и т.д. Итак, как мне это сделать?
$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>
В основном, вы обновляете $scope.userRatings
, поэтому я бы использовал что-то вроде этого, которое состояло бы из:
сначала получить следующие предметы
затем добавив эти элементы в свой список. Обратите внимание, что я предлагаю метод слияния, но без дополнительной информации о вашей структуре данных, трудно предложить что-то подходящее.
Я не знаю, как вы можете получить noMoreResults для истины, но вы можете знать, когда его можно разглядеть;)
,
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');
};
EDIT: Как ваш ответ выглядит так:
[{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]);
}