Question

你是Angular am的新手，使用$ interval定期调用一个函数，我想在下一次函数调用时在屏幕上显示一个计时器，倒数到下一个调用。无论如何，在这个功能中有简单的方法。

function init(){
    $scope.interval = $interval(function(){
      $scope.loading = true;
    //$scope.countdown = countdown to next call;
      doSomework();
    }, 60000);
}

欢迎提出任何建议。谢谢提前

Answer 1

function init(){
   var remainingTime = 60;
   var interval   = $interval(function(){
   $scope.loading    = true;
   remainingTime     = remainingTime - 1;
   $scope.showRemainingTIme = remainingTime; // Use this variable to show on the view page
   if(remainingTime == 0) {
   $interval.cancel(interval);
    doSomework();
   }

  }, 1000);
}

Answer 2

这是你需要的。 $interval中的第二个参数是您希望函数执行的时间及其以毫秒为单位的1000ms=1sec。因此，每隔一秒后它将减少$scope.remainingTimeby 1的值。您可以根据您的要求获得该值。仅仅为了演示，我认为它是60，间隔是1秒所以每秒后$scope.remainingTimewill递减1

＆＃13;

angular.module('timerApp', []);
angular.module('timerApp').controller('timerController', ['$scope', '$interval', function ($scope, $interval) {
    $scope.remainingTime = 60;
		$scope.timeInterval=$interval(function(){
    	$scope.remainingTime      =  $scope.remainingTime  - 1;
        if($scope.remainingTime==0){
           //$interval.cancel($scope.timeInterval);
           $scope.remainingTime=60;
        }
  }, 1000);
}]);

＆＃13;

<head>
  
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
  </head>
<body>
  <div ng-app="timerApp" ng-controller="timerController">
  
    <div >{{remainingTime}}</div>
</div>
 </body>

＆＃13;

AngularJS $ interval显示计时器（当间隔过去时）

2 个答案: