Question

嗨，对于无限滚动我已经在javascript中编写了一段代码来检测窗口的结尾

$(window).scroll(function(){
    if  ($(window).scrollTop() == $(document).height() - $(window).height()){
          console.log("loading another page")

          $scope.loadMoreLiveFeed();


    }
 });

我在json中获得了100个帖子，我将它分成10块，然后每当我们向下滚动时调用loadMoreFeed函数。但为了表明我们正在加载帖子，我使用$ timeout在loadMoreLiveFeed代码中引入了1秒的延迟。所以我可以有这种加载效果。

问题是当我添加这个延迟时，我的函数loadMoreLiveFeed被调用两次，一旦我删除了loadMoreLiveFeed函数被调用一次。我不知道为什么电话会发生两次

这是我的loadMoreLiveFeed函数

 $scope.loadMoreLiveFeed = function() {

    if(scrollFlag && counter<20){
    $(".loader").show();
    $(".viewAll").hide();

    timer = $timeout(function() {
    for(var i =0; i<10; i++);

    }, 500);


    timer = $timeout(function() {

    if( $scope.tempPosts!= null)
    {

        for(var i =(10*counter); i < ((10*counter)+10) && counter < 20; i++) 
        {       console.log($scope.tempPosts[i].nid +"   " +counter);

                $scope.posts.push($scope.tempPosts[i]);

        }
        if(counter>=10){scrollFlag=false;}
        counter++;


    }

    $(".loader").hide();
    $(".viewAll").show();

    }, 1000);


 }
}

非常感谢您的帮助。

由于

Answer 1

我建议使用经过测试的指令。

看看这个：https://github.com/sroze/ngInfiniteScroll

Answer 2

我解决了这个问题，我刚刚添加了一个if条件，显示所有div加载后的所有div并且它有效。呼叫自动同步。我刚刚在loadMoreLiveFeed函数结束时更改了这个位

if (counter >= 10) {
  $('.loader').hide();
  $('.viewAll').show();
}

角js的无限滚动

2 个答案: