Как перейти к концу области просмотра "бесконечный свиток"?

Я использую ui-scroll для реализации бесконечной прокрутки в моем приложении Angular.

Он отлично работает, и я использую его для отображения списка событий.

Однако, когда мое приложение загружается, оно отображает первые события по умолчанию (индекс 1 на самом деле). Чтобы увидеть самые последние события, нужно прокрутить список событий вниз. Это проблема, когда список событий действительно большой и в некоторой степени побеждает точку разбиения на страницы, потому что веб-приложение должно пройти через все события, чтобы получить самые последние из них.

Как я могу дать команду ui-scroll начать с последних событий? Очевидно, у меня есть метод бэкэнда (HEAD запрос, который я могу использовать, чтобы получить общее количество событий), чтобы получить первоначально желаемый индекс. Я просто не могу найти способ поместить этот начальный индекс в ui-scroll.

Любая подсказка?


Как и требовалось, вот пример кода, хотя это довольно "стандартный" материал пользовательского интерфейса:

<ul ui-scroll-viewport class="event-list" ng-class="{loading: eventsLoading}">
  <li ui-scroll="event in eventsProvider" data-buffer-size="20" is-loading="eventsLoading">
    <p>event.text</p>
  </li>
</ul>

Вот что у меня в контроллере:

$scope.eventsProvider = {
  get: function(index, count, success) {
    $scope.events = ZoneEventsService.query({
      session_type: $scope.session_type,
      zone: $scope.zone,
      offset: index - 1,
      limit: count
    }, function(result) {
      success(result.items);
    });
  }
};

1 ответ

Я действительно нашел способ. В моем контроллере я откладываю первую загрузку данных и вручную смещаю свое смещение на общее количество событий. Поскольку пользовательская прокрутка обрабатывает отрицательные смещения из коробки, она просто работает.

$scope.eventsInfo = ZoneEventsService.head({
  session_type: $scope.session_type,
  zone: $scope.zone,
  limit: 0,
});

$scope.eventsProvider = {
  get: function(index, count, success) {
    // The promise will wait the first time around and be resolved already on following calls.
    $scope.eventsInfo.$promise.then(function() {
      $scope.events = ZoneEventsService.query({
        session_type: $scope.session_type,
        zone: $scope.zone,
        // Here goes the magic.
        offset: index - 1 + $scope.eventsInfo.total_count,
        limit: count
      }, function(result) {
        success(result.items);
      });
    });
  }
};
Другие вопросы по тегам