カウントダウンを停止するanglejs

Question

私はこのコードを書いたので、カウントダウンが00:00になったら停止したい。私は$interval.cancel();を使用したいが、私はそれを使う方法を知らない。

私のコードはここにある：

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope, $interval) { 
 
    $scope.counter = 10; 
 
    $interval(function(){console.log($scope.counter--)},1000); 
 
}); 
 
app.filter('counter', [function() { 
 
    return function(seconds) { 
 
     return new Date(1970, 0, 1).setSeconds(seconds); 
 
    }; 
 
}])

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
<p>{{counter | counter | date:'mm:ss'}}</p> 
 
</div>

Answer 1

counter != 0のような条件を追加し、間隔をクリアします。

$intervalによれば、間隔をキャンセルするという約束が必要です。

var app = angular.module('myApp', []); 
 
    app.controller('myCtrl', function($scope, $interval) { 
 
     $scope.counter = 10; 
 
     var intervalTime=null; 
 
     intervalTime= $interval(function(){console.log($scope.counter--); 
 
     if($scope.counter == 0){ 
 
       $interval.cancel(intervalTime); 
 
       intervalTime = null; 
 
     } 
 
},1000); 
 
    }); 
 
    app.filter('counter', [function() { 
 
     return function(seconds) { 
 
      return new Date(1970, 0, 1).setSeconds(seconds); 
 
     }; 
 
    }])

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
<p>{{counter | counter | date:'mm:ss'}}</p> 
 
</div>