AngularJS - 使用requestAnimationFrame进行简单倒计时（启动/停止/重启）

Question

这是小plnkr

我只是在完成时尝试打印倒数秒from 11 to 0和then restart。

问题是它不会在html中打印秒也尝试使用$apply，但我得到摘要错误。 此外，当重新开始倒计时我遇到问题时，秒数没有正确更新...

如何更轻松地实现这一目标？

任何帮助表示感谢

Answer 1

问题出在requestAnimationFrame。 Angular不知道应该绑定新值，而且我不认为这里需要动画帧。尝试用$ timeout替换动画帧，然后angular将知道应该重新绑定数据。 plnkr

Answer 2

你去吧

(function withAngular(angular) {

'use strict';

angular.module('app', ['ngRoute'])
.controller('Ctrl', function($scope, $window, $timeout) {

  $scope.countSeconds = 11;
  $scope.updateCountdown = function updateCountdown(ms) {

    $timeout(function() {

      if($scope.countSeconds === 0){
      $scope.countSeconds = 11;
      }
     else{$scope.countSeconds--;   }
     $scope.updateCountdown($scope.countSeconds);   
    }, 1000);
  };



  $scope.updateCountdown(0);



});
  }(angular));