0

我正在使用来自 angular-ui 的 ui-scroll（干得好，组件很棒！）。

在大多数情况下，一切都运行良好。当我向下滚动时，数据是从自定义数据源加载的。但是，当我滚动回顶部时，我最终会在视口中看到很多空白。

经过检查，看起来 ui-scroll 正在添加一个子 div 并动态设置高度，但由于某种原因，当我滚动到视口顶部时，它并没有被设置回 0。

我猜这与我的数据源提供数据的方式有关。我也没有把头绕在负索引上。当我映射到标准分页服务（索引+偏移量等）时，有人可以解释我应该如何在 datasource.get() 函数中考虑负索引吗？

4

2 回答 2

0

在数据数组有限的情况下，ui-scroll 数据源实现可能如下所示

var min = 1, max = 100;
dataSource.get = function(index, count, success) {
    var start = Math.max(min, index);
    var end = Math.min(index + count - 1, max);
    if (start <= end) {
        getDataAsync(start, start + end + 1).then(success);
    }
    else {
        success([]);
    }
};

这允许您处理以索引开头的数据数组min。此外，您还可以轻松消除底部 via 的限制var end = index + count - 1。

但我也想说，这可能是后端责任。查看此示例：https ://rawgit.com/angular-ui/ui-scroll/master/demo/append/append.html – 数据数组限制在 1 到 50 之间，而数据源（跳过详细信息）只是

get: function (index, count, success) {
    Server.request(index, count).then(success);
}
于 2017-09-09T02:19:03.967 回答
0

好吧，我想我找到了解决方案......希望这对其他人有帮助，因为我在 angular-ui 团队提供的演示中找不到真正的工作示例。

本质上，当您收到负索引时，您必须 1) 将索引钳位为 0，然后根据差异调整计数变量。

这是一些示例代码：

    dataSource.get = function (index, count, successCallback)
    {
        // Index provided is 1-based, we'll convert to 0-based and clamp at 0
        var realIndex = Math.max(1, index) - 1;

        if (index < 0) {
            count -= 1 - index;
        }

        if (realIndex < 0 ||
            count == 0 || 
            realIndex >= vm.searchResultCount)
        {
            successCallback([]);
            return;
        }

        ...
        Make a pagination call to a service that expects the first 
        page of results to be at index 0.
于 2017-02-22T21:35:47.103 回答