Как выполнить разбиение на страницы на стороне сервера с помощью angular-ui bootstrap с помощью параметра skip?

0

У меня есть несколько элементов, сгенерированных с помощью ng-repeat, я должен добавить pagination.but, везде я вижу, получая значение количества элементов, я могу добавить. но я не могу получить пропуск. т.е. если значение пропуска равно 10, оно пропустит первые пункты и перечислит другие элементы, мне нужно сделать, как использовать значение пропуска с помощью бутстрапа с угловым ui.
следующий код внутри службы

mainEvents: function() {
        var self = this;
        var skipNumber=2;
        return $http.get(UrlService.baseUrl + '/event/upcoming?count='+ skipNumber).then(function(response) {
            // var events = response.data;
            var events = response.data.events;
            var upEvents=[];

            var eventsLen = events.length;
            for (var i = 0; i < eventsLen; i++) {
                self.prepareForRendering(events[i]);
            }
            var totalItems = response.data.events.length;

            angular.copy(response.data.events, upEvents)
             console.log(upEvents);
            // angular.copy(response.data.tracks, $scope.tracks)
            return events;

        }, function(response) {
            return $q.reject(response.data.error)
        });
    },
$scope.pageChanged = function() {
    mainEvents();
  };

наценка

<ul>
  <li ng-repeat="event in events">{{event.name}}</li>
</ul>

<pagination total-items="totalItems" ng-model="skipNumber" ng-change="pageChanged()" items-per-page="1"></pagination>

На основе числа страниц, нажатых, skipNumber будет увеличен на 10, 20 и т.д., Как это сделать.может кто-нибудь, пожалуйста, помогите мне

  • 0
    Можете ли вы сделать это более понятным? Вы хотите иметь набор из 10 новых значений данных из бэкэнда для каждого вызова, и это должны быть последующие данные.
  • 0
    @GandalftheWhite от бэкэнда я использую пропустить. если я отправлю запрос с apiurl?skip=10 он пропустит первые 10 элементов, для первой страницы будет apiurl?skip=10 0, для второй страницы должно быть 10, как показано ниже. я хочу отображать только 10 элементов одновременно
Показать ещё 1 комментарий
Теги:
pagination
angular-ui-bootstrap

1 ответ

1
Лучший ответ

Рабочая скрипка.

Переменная events - это массив, поэтому с ним можно использовать метод slice: ng-repeat="event in events.slice( (currentPage - 1) * itemsPerPage, currentPage * itemsPerPage )".

Вы установили itemsPerPage, как 1 здесь: items-per-page="1" и currentPage есть ($scope.skipNumber/$scope.itemsPerPage) + 1 (результат DeVision здесь должен быть целым).

Полученный html будет выглядеть так:

<ul>
  <li ng-repeat="event in events.slice( (currentPage - 1) * itemsPerPage, currentPage * itemsPerPage)">{{event.name}}</li>
</ul>

<pagination total-items="totalItems" ng-model="currentPage" items-per-page="itemsPerPage"></pagination>
  • 0
    Я использовал, как вы упомянули. но если я также изменяю элементы на странице, он показывает только один элемент. в консоли я получаю 4 предмета
  • 0
    @ Кодер Не думаю, что я тебя правильно понимаю. items-per-page имеет значение 1 в вашем фрагменте, поэтому он делает то, что вы указали, показывать 1 элемент на странице. Была ли это проблема?
Показать ещё 10 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню