如何在我的Firebase无限滚动中按时间顺序正确排序数据？

Question

如何在我的Firebase无限滚动中按时间顺序正确排序数据？

Cod*_*000 9 javascript node.js firebase firebase-realtime-database

码:

<script>

    var app = angular.module('app', ['firebase']);

    app.controller('ctrl', function ($scope, $firebaseArray, $timeout) {


            console.log(<%=lastID%>);

            $scope.data = [];
            var _n = Math.ceil(($(window).height() - 50) / (350)) + 1;
            var _start = <%= lastID %>;
            var _end = <%= lastID %> + _n - 1;

            $scope.getDataset = function() {

                fb.orderByChild('id').startAt(_start).endAt(_end).limitToLast(_n).on("child_added", function(dataSnapshot) {

                    $scope.data.push(dataSnapshot.val());
                    $scope.$apply()
                    console.log("THE VALUE:"+$scope.data);

                });

                _start = _start + _n;
                _end = _end + _n;

            };


            $scope.getDataset();

            window.addEventListener('scroll', function() {
                 if (window.scrollY === document.body.scrollHeight - window.innerHeight) {
                      $scope.$apply($scope.getDataset());
                 } 
            });

    });

    // Compile the whole <body> with the angular module named "app"
    angular.bootstrap(document.body, ['app']);


</script>

Run Code Online (Sandbox Code Playgroud)

情况:

lastID是最后创建的帖子的ID.它们向后(从-1到lastID).

此解决方案完美无缺,除非删除某些帖子.

(帖子从最新到最旧(从lastID到-1)排序).

例如,如果有16个帖子,则lastID = -16.

如果我删除帖子-13到-5并发布-3,则lastID保持在-16.

这意味着当页面加载时,在加载3个第一个帖子(-16到-14)之后没有帖子出现,我需要反复向下滚动才能显示帖子-4.

题:

如何确保删除某些帖子,我的无限滚动脚本将跳过不存在的帖子的ID并只加载最近的3个帖子？

我检查了什么:

我看着这个:

以降序发布的顺序显示帖子

但我不确定如何在我的无限卷轴中实现这些解决方案.有任何想法吗？

Answer 1

Nik*_*nko 1

如果我理解正确的话，你不必使用 end。这可以使用 startAt + limit 来实现

fb.orderByChild('id').startAt(_start).limit(n)...

Run Code Online (Sandbox Code Playgroud)

并使用布局对项目进行降序排序。使用这个你不必担心 id 的顺序（如果它们是连续的）

更新

您可以更简单地做到这一点。只需使用最新值更新您的开始即可

fb.orderByChild('id').startAt(_start).limit(_n).on("child_added", function(dataSnapshot) {

    $scope.data.push(dataSnapshot.val());
    $scope.$apply()
    _start = dataSnapshot.child('id').val()
    console.log("THE VALUE:"+$scope.data);

});

Run Code Online (Sandbox Code Playgroud)

在这种情况下，您_start将始终保留最后一个 id，并且您可能不必担心删除的元素。或者，您可以使用临时变量来存储最后一个 id 值并将其用于startAt

归档时间：	8 年，8 月前
查看次数：	514 次
最近记录：	8 年，8 月前