显示AngularJS$timeout进度条

Question

我有一条警报消息，我想在一段时间后隐藏它。我使用$timeout，效果很好。然而，我想在这个警报框的底部添加一个小的水平倒计时（也称为进度）栏，让用户知道他们的时间不多了。

AngularJS$timeout似乎无法确定它运行了多长时间。在这种情况下，我应该如何更新进度条？

我像这个一样使用$timeout

$timeout(function(){
  $scope.m.hideAlertMessage = true;
}, 10000)

Answer 1

您应该使用$interval每秒运行一次并更新计数器作用域变量，当它达到10时，您可以终止间隔并执行您想做的任何操作。

例如

$scope.counter = 0;
$interval(function() {
    $scope.counter++;
    if($scope.counter == 10) {
        // Do whatever you wanted
    }
}, 1000, 10);

$interval的第三个参数是要运行的次数。

请注意，默认情况下，这是在$scope.$apply()的迭代中运行的，因此对$scope.counter的更改将立即在视图中可见。