倒計時按鈕angularjs

Question

我創建了一個倒計時功能，它只在用戶處於瀏覽器的當前窗口時計數，並且工作得很好，唯一的問題是當我將代碼插入到angularjs控制器中時。它停止工作，上面我留下我的代碼給大家有一個想法是什麼錯誤。

JS：

var span = angular.element('#count'); 
     var counter = 30; 
     var timer; 

     var startTimer = function() { 
      // do nothing if timer is already running 
      if (timer) return; 

      timer = setInterval(function() { 
       counter--; 
       if (counter >= 0) { 
        span.innerHTML = counter; 
       } 
       // Display 'counter' wherever you want to display it. 
       if (counter === 0) { 
        alert('this is where it happens'); 
        stopTimer(); 
       } 
      }, 1000); 
     }; 

     var stopTimer = function() { 
      clearInterval(timer); 
      timer = null; 
     }; 

     var onBlur = function() { 
      stopTimer(); 
     }; 

     var onFocus = function() { 
      startTimer(); 
     }; 

     var onLoad = function() { 
      startTimer(); 
     }; 


     angular.element(window).load(onLoad); 
     angular.element(window).blur(onBlur); 
     angular.element(window).focus(onFocus); 

HTML：

<a class="btn btn-medium btn-orange" href=""> 
      In<span id="count">30</span></a> 

Answer 1

不要使用角碼內等的setTimeout或setInterval的非角度的功能。這些函數不會成爲摘要循環的一部分，您的視圖也不會改變。

看看這個例子，用角度創建一個計時器。

https://codeforgeek.com/2014/09/refresh-div-angularjs-interval/