AngularJS - 有限数组上的无限循环



我有一个列表,其中包含10-500条记录,使用标准NG-REPEAT以图形数组的形式出现在屏幕上,可视化是一排照片

我想实现的目标,但如果可能的话,我无法完全理解......

屏幕上仅显示 10 条记录的"窗口" - 完成 您可以向左或向右滚动整个列表 - 完成

然而

我想实现的是,当到达列表的末尾时,列表从头开始,但处于无限的样式循环中。双向

我从来没有做过这样的事情,也不太确定我将如何实现我的 ng-repeat(列表项中的项目)

所以我假设最好的解决方案是

当用户通过 100 条记录获取 40 条记录时,我从我的$scope中推送() 前 20 条记录。列表项到数组的末尾,并从前面删除等效的前 20 条记录。.这保留了 100 条记录的恒定列表,没有大量的内存使用。我甚至可以在个人记录的基础上做到这一点。从列表的末尾或开头删除一条记录,并在列表的开头或结尾添加。

用户体验是无限滚动,但我怀疑由于处理正在进行,浏览器体验可能会很慢且卡顿

Push(),Pull(),跟踪和索引将发挥作用,但无论这在技术上是否可行,任何建议都将不胜感激

编辑:经过一些研究。

$scope.ListofItems.push($scope.ListofItems.shift());

可能是从头到尾移动的解决方案,但不确定如何触发或走另一条路(拉?

EDIT2 :刚刚为上述内容做了一个手动调用的函数,它将前面的项目移动到列表的末尾,尽管我不知道如何读取屏幕位置以了解何时触发该函数

反其道而行之

可能是
$scope.ListofItems.unshift($scope.ListofItems.pop());

作为旁注,我认为重要的是要记住大型数组,shift()unshift()自然会导致完全重新索引并且时间复杂度为 O(n),其中 n 是数组的长度,而不是时间复杂度为 O(1) 的push()pop()

最新更新