范围不更新 ionic-angularJs 中的视图（使用 $interval）

Question

我在 ionic+angularjs 中有这个鬼鬼祟祟的问题。我在控制器中有一些看起来像这样的代码..

$scope.progressval = 0;
var stop = $interval(function() {
      $scope.progressval = $scope.progressval + 1;
       if( $scope.progressval >= 100 ) {
             $interval.cancel(stop);
             $state.go(‘app.b’);
        }
 }, 100);

我的 html 页面如下所示：

<progress id="progressbar" max="100" value="{{ progressval }}"> </progress>
<div id="progressbarlabel">{{ progressval }} %</div>

是的，我正在尝试更新页面上的进度条。问题是，当我第一次加载应用程序（在浏览器中）时，我看不到进度条的稳定进度（它确实有效，从某种意义上说，它确实进入了状态 b)。但是，当我再次尝试（无需重新加载）时，它似乎可以工作。我尝试添加 $scope.$apply() 但也无济于事。任何反馈将不胜感激..

Answer 1

尝试添加 $timeout（调用 $apply）

$scope.progressval = 0;
var stop = $interval(function() {
      $timeout(function(){
         $scope.progressval = $scope.progressval + 1;
      });
       if( $scope.progressval >= 100 ) {
             $interval.cancel(stop);
             $state.go(‘app.b’);
        }
 }, 100);