Angular - 延迟forEach

Question

我有个问题.我正在尝试创建一个动画,改变几个图层的颜色,画面之间有一个超时.

$scope.StartMovementsAnimation = function()
{
      angular.forEach($scope.GameMovements, function(movement){
       if (movement == "Green")
       {
          $scope.Green = true;
       }
       else (movement == "Orange")
       {
          $scope.Orange = true;
       } 
  });
}

我遇到的问题是我不知道如何停止或延迟流循环.我很丢失.我尝试使用$ timeout,睡眠等但不起作用.

有解决方案吗

谢谢

Answer 1

不要使用forEach.使用$ timeout重复GameMovements数组中的项目数.

看一下下面的例子.它会将className字段从橙色变为绿色,反之亦然,直到变量left的值达到0.

$scope.className = "orange";
$scope.count = 0;
$scope.startAnimation = function() {
  var left = 10
  var ticker = function() {
    if (left % 2 === 0)
      $scope.className = 'orange'
    else
      $scope.className = 'green'
    left -= 1
    if (left > 0) {
      $timeout(ticker, 1000)
    }
  }

  $timeout(ticker, 1000)
}