首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何跳到“无限滚动”视图的末尾?

如何跳到“无限滚动”视图的末尾?
EN

Stack Overflow用户
提问于 2016-01-19 15:51:21
回答 1查看 772关注 0票数 2

我使用用户界面卷轴在我的角度应用程序中实现无限滚动。

它工作得很好,我用它来显示一个事件列表。

但是,当我的应用程序加载时,默认情况下它会显示第一个事件(实际上是索引1 )。要查看最近的事件,必须向下滚动事件列表。这是一个问题,当事件列表真的很大和种类-失败的点分页加载,因为web应用程序必须经过所有的事件,以获得最新的事件。

我如何指示ui-滚动开始与最后的事件?显然,我有一个后端方法(可以用来获取事件总数的HEAD请求)来获得最初想要的索引。我只是找不到一种方法把初始的索引放在ui-滚动。

有线索吗?

按照要求,这里有一个代码示例,尽管它是相当“标准”的ui滚动内容:

代码语言:javascript
复制
<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>

下面是我在控制器中的内容:

代码语言:javascript
复制
$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);
    });
  }
};
EN

回答 1

Stack Overflow用户

发布于 2016-01-19 16:24:35

实际上我找到了一种方法。在我的控制器中,我推迟了数据的第一次加载,并通过事件总数手动抵消了我的偏移量。由于用户界面滚动处理负偏移的盒子,它只是工作。

代码语言:javascript
复制
$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);
      });
    });
  }
};
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/34881143

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档