Javascript 如何在ngInfiniteScroll（AngularJS）中设置油门参数

在我的Angular应用程序中，我使用ng infinite scroll允许用户使用此处的插件持续滚动他们的“新闻提要”-

在我的桌面上，它运行得很好，但在Android设备上的Cordova应用程序中运行时，无限滚动会占用大量CPU资源。我正在尝试使用THROTTLE_millizes选项每x秒只处理一次滚动事件（这将提高性能并减少滚动的抖动）

我的模块定义如下：

var abcdDirectives = angular.module('abcdDirectives', []);
var abcdServices = angular.module('abcdServices', [ 'ngResource', 'infinite-scroll', 'ngCookies']);

abcdApp.value('THROTTLE_MILLISECONDS', 10000);

我试着用上面的线来控制这个，但它似乎没有任何区别

在我的模板视图中，我有以下代码：

<div 
  infinite-scroll="tabs[tabIndex].FeedService.loadFeed(false, tabs[tabIndex].FeedService.filters, search.text, search.dateFrom, search.dateTo)"
  infinite-scroll-disabled="tabs[tabIndex].FeedService.busy || tabs[tabIndex].FeedService.noMoreResults || !tabs[tabIndex].active || tabs[tabIndex].FeedService.initialLoad"
  infinite-scroll-distance="1"
  infinite-scroll-immediate-check="false" >
<div ng-repeat="interaction in getTabItems(tabIndex) track by $index">

我在控制台日志中看到的上述函数中的控制台日志被一次又一次地输出得太多了&我试图阻止调用此函数，但我使用的throttle语句似乎没有什么区别？我在代码上做错了什么

--版本--

Angular 1.3.0

---

应在将使用

ngInfiniteScroll

的模块上设置

ngInfiniteScroll 1.2.2
THROTTLE\u毫秒
。因此，对于您的情况，应该将其设置为
abcdServices
，如下所示

var abcdDirectives = angular.module('abcdDirectives', []);
var abcdServices = angular.module('abcdServices', [ 'ngResource', 'infinite-scroll', 'ngCookies']);

abcdServices.value('THROTTLE_MILLISECONDS', 10000);

但在我看来，值应该与它的直接父级（使用
ngInfiniteScroll
）有关。像这样

angular.module('yourApp.controllers', [])
.value('THROTTLE_MILLISECONDS', 5000)
.controller('controllerWhichUseInfiniteScroll',
['$scope',
    function ($scope) {
    }
]);

如果在呈现
tabs[tabIndex].FeedService.loadFeed的新结果之前将
infinite scroll disabled
标志设置为true，则
infinite scroll
事件函数（
tabs[tabIndex].FeedService.loadFeed
将在无限循环中运行

要解决此问题，请在下一个摘要循环中使用
$timeout
将
无限滚动禁用
标志设置为true。这意味着该标志仅在渲染结果完成时才为真。见下文

<div 
  infinite-scroll="getDataFromApi()"
  infinite-scroll-disabled="loaded"
  infinite-scroll-distance="1">
    <div ng-repeat="data in dataList">

还值得指出的是，出于性能原因，
getTabItems（）
不应用于绑定html中的数据。因为angular将把它放在摘要循环中进行更改检测，并且无论您是否使用
ngInfiniteScroll
，它都将被大量调用

<div 
  infinite-scroll="getDataFromApi()"
  infinite-scroll-disabled="loaded"
  infinite-scroll-distance="1">
    <div ng-repeat="data in dataList">

angular.module('yourApp.controllers')
.controller('yourController',
['$scope', '$timeout', 'apiDataService',
    function ($scope,  $timeout, apiDataService) {
        $scope.dataList = [];

        $scope.getDataFromApi = function () {
            $scope.loaded = false;
            apiDataService.getData()
                .then(function(result) {
                    $scope.dataList = result.data;

                    //Set loaded to true after rendering new results is finished.Otherwise it will make infinite api calls.
                    $timeout(function (){
                        $scope.loaded = true;
                    });
                });
        }
    }
]);