Question

问题：如果我在ion-view回调未完成处理时退出当前on-finite，则on-infinite回调将开始在循环中调用，直到该应用程序冻结即使我不再在视图中安装了ion-infinite-scroll。

这很难再现，但我找到了一种轻松表现出来的方法。在视图上设置on-infinite回调。

<ion-infinite-scroll
    immediate-check="false"
    on-infinite="loadMore()"
    distance="5%">
</ion-infinite-scroll>

然后使用$timeout人为地将loadMore()函数减速到2秒。像这样：

$scope.loadMore = function() {
    console.log("Loading more...");
    $timeout(function() {
        $scope.$broadcast('scroll.infiniteScrollComplete');
    }, 2000);
};

现在，触发无限滚动，而你的loadMore()功能是＆＃34;处理＆＃34; 2秒钟，离开你的视野。您将看到，即使您处于另一个视图中，控制台仍将继续打印＆＃34;加载更多...＆＃34;每2秒。也就是说，loadMore()被循环调用。

在实际情况中，此错误导致应用程序严重冻结。在一些链接上，这个问题已得到解决，但没有解决方案（离子论坛正在下降，顺便说一下）。有些解决方案建议在infiniteScrollComplete内调用$apply()，但这并不能解决问题，实际上会触发digest already in progress错误。其他人建议使用$timeout(...,0)作为$apply()的替代方案，但例如，如果您的loadMore()对您的服务器执行异步调用，则问题仍然存在，在这种情况下仍有机会loadMore()忙时用户退出视图。

是否有任何建议的解决方法？

离子团队：这是一个错误。关于离子无限滚动的所有文档都完全忽略了这一点。应该至少有一个警告。我的离子版本1.7.16。

Answer 1

请尝试使用以下代码停止加载更多回调。

HTML

<ion-view view-title="Search">
    <ion-content>
        <h1>Search</h1>
        <ion-infinite-scroll
        immediate-check="false"
        ng-if="!noMoreItemsAvailable"
        on-infinite="loadMore()"
        distance="5%">
    </ion-infinite-scroll>
</ion-content>
</ion-view>

控制器

$scope.loadMore = function()
{
    $http({
    method:'GET',
    url:'http://headers.jsontest.com/'
    }).then(function(response)
    {
        console.log(response);
        $scope.noMoreItemsAvailable = true;
    }, function(response)
    {});
}

Answer 2

尝试下面的无限循环功能代码

<强> HTML

    <ion-infinite-scroll 
        ng-if="!noMoreDaTa" on-infinite="loadData()" 
        distance="2%" immediate-check="false">
    </ion-infinite-scroll>

<强>控制器

    $scope.loadData = function() {
       if ($scope.dataRecords.length >= $scope.total_records) {
           $scope.noMoreDaTa = true;
       }
    }

如果您需要帮助，请告诉我们。）

离子无限滚动循环永远调用 - 无限回调

2 个答案:

HTML

控制器