スロットル/デバウンスを使用してイベントをカウントして、イベントを実行します。

Question

イベントトリガx回をカウントするためにアンダースコアのスロットル/デバウンスを使用するにはどうすればよいですか？その後、一定の間隔の後にxの知識でイベントをトリガーしますか？

HTML

<div ng-app ng-controller="testC"> 
    <input type="submit" ng-click="add()" value="add"></input> 
    {{counter}} 
</div> 

JS

function testC($scope) { 
    $scope.counter = 0; 
    $scope.add = function() { 
     $scope.counter++; 
    } 

    /* 

     counter x-timed add has triggered 
     after interval has been reached trigger a event that does $scope.counter = $scope.counter + x 

    */ 
} 

https://jsfiddle.net/6w747zzL/

Answer 1

私は私のコメントで書いたように、あなたはすべてのX-ミリ秒 "ヘビーデューティー" 機能を呼び出すためにスロットルを使用するので、このあなたがそれを行う方法です：

<div ng-app ng-controller="testC"> 
    <input type="submit" ng-click="add()" value="add"> 
    counter: {{counter}} <br> 
    throttle: {{ throttle }}<br> 
    non-throttle: {{ nonthrottle }} 
</div> 

function testC($scope, $timeout) { 
    $scope.counter = 0; 
    $scope.add = function() { 
     $scope.counter++; 
    } 

    $scope.throttle = 0; 
    $scope.$watch('counter', _.throttle(function(value) { 
     // Wrapping this in '$timeout' will ensure a digest cycle execute that will update the view (Since underscore is not native angular function) 
     $timeout(function() { 
      $scope.throttle++; 
     }); 
    }, 500)); 

    $scope.nonthrottle = 0; 
    $scope.$watch('counter', function(value) { 
    $scope.nonthrottle++; 
    }); 
} 

ボタンをすばやくクリックすると、ボタンをクリックするたびにスロットルウォッチャーが更新されず、500msごとに最大で1回だけ更新されることがわかります。

の作業例：https://jsfiddle.net/6w747zzL/2/