javascript - 尝试将 $interval 与全局变量转换为函数

Question

我有一个代码，我希望它用不同的属性重复多次。

我正在使用 AngularJS 的 $interval，但无法将这段代码转换为函数。下面我将发布两个代码，没有函数的代码和我尝试使用函数但给出错误的代码。

原始代码

$scope.alarm.times.armed_away.pending_time = null;
var pendingTime;
var promiseAlarmPendingTime;

$scope.alarm.times.armed_away.pending_time = entity.attributes.armed_away_pending_time;

promiseAlarmPendingTime = $interval(function(){
   if($scope.alarm.times.armed_away.pending_time >= 0) {
      $scope.alarm.times.armed_away.pending_time -= 1;
      if($scope.alarm.times.armed_away.pending_time > 10) {
         playSound('audio/alarm_pending_time_1.mp3');
      } else if($scope.alarm.times.armed_away.pending_time > 0) {
         playSound('audio/alarm_pending_time_2.mp3');
      } else if($scope.alarm.times.armed_away.pending_time == 0){
         $interval.cancel(promiseAlarmPendingTime);
      }
   } else {
      $scope.alarm.times.armed_away.pending_time = null;
      $interval.cancel(promiseAlarmPendingTime);
      promiseAlarmPendingTime = null;
   }
}, 1000);

我尝试让它与函数一起工作

promiseAlarmPendingTime = $interval($scope.fnAlarmPendingTime(
   $scope.alarm.times.armed_away.pending_time,
   promiseAlarmPendingTime), 1000);

$scope.fnAlarmPendingTime = function(pendTime, promise){
   if(pendTime >= 0) {
      pendTime -= 1;
      if(pendTime > 10) {
         playSound('audio/alarm_pending_time_1.mp3');
      } else if(pendTime > 0) {
         playSound('audio/alarm_pending_time_2.mp3');
      } else if(pendTime == 0){
         $interval.cancel(promiseAlarmPendingTime);
      }
   } else {
      pendTime = null;
      $interval.cancel(promise);
      promise = null;
   }
};

函数重复自身 1 次然后给出错误:

TypeError: f is not a function

我也尝试删除函数内的整个代码，但出现了同样的错误。也许是语法问题？

Answer 1

你有几个选择:

1)调用一个调用你的函数并传递参数的函数。
2) 在您的 $interval 调用中传递参数。

$interval 具有以下签名:$interval(function, delay, [count], [invokeApply], [parameters])。你已经知道function和delay是什么了——count，如果设置为非零正数，就是interval应该执行的次数运行。 invokeApply 会将 function 包装(或不包装)在 $scope.$apply() 中，这样您就可以控制脏模型检查是什么导致 View 更新。最后，parameters 是您要传递给函数的参数。

示例 1

angular.module('app', [])
  .controller('ctrl', function($interval, $scope) {
    $scope.counter = 0;
    let promise = $interval(() => incrementCounter(promise), 1000);

    function incrementCounter(promise) {
      $scope.counter++;
      if ($scope.counter == 10) {
        $interval.cancel(promise);
      }
    }
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  Counter: {{ counter }}
</div>

示例 2

angular.module('app', [])
  .controller('ctrl', function($interval, $scope) {
    $scope.counter = 0;
    let promise = null; // promise needs to be initialized before you can pass it as a parameter using this method
    promise = $interval(incrementCounter, 1000, 0, true, promise);

    function incrementCounter() {
      $scope.counter++;
      if ($scope.counter == 10) {
        $interval.cancel(promise);
      }
    }
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  Counter: {{ counter }}
</div>