Javascript 在AngularJS中定期重新加载数据时，数据会闪烁

我需要一些东西定期从外部REST Api重新加载数据，因此我找到并使用了以下问题中的代码：

代码复制到此处：

    app.controller('MainCtrl', function($scope, $http, $timeout) {

  // Function to get the data
  $scope.getData = function(){
    $http.get('style.css')
      .success(function(data, status, headers, config) {

      // Your code here
      console.log('Fetched data!');
    });
  };

  // Function to replicate setInterval using $timeout service.
  $scope.intervalFunction = function(){
    $timeout(function() {
      $scope.getData();
      $scope.intervalFunction();
    }, 1000)
  };

  // Kick off the interval
  $scope.intervalFunction();

});

我的代码唯一的区别是我使用ngResource来获取内容，而不是$http（我不知道这是否有区别）

我只是在我的视图中打印数据，问题是每次更新（每秒一次）文本都会闪烁。在恢复新数据时它会消失吗？显然，我希望它只是顺利更新而不闪烁

问题在于时机。 浏览器解析空数据集并呈现模板，然后，当数据出现时，它将再次解析数据并重新绘制。这些$digest可能会导致闪烁

有两种方法可以避免这种情况：

1） 对父元素使用

ng-clope

指令

2） 创建一个假布尔值，在加载数据时将其设置为真，并在父元素上添加带有该布尔值的

ng if

此外，您还可以重写

$digest

方法，并查看调用的次数以及触发次数。 请注意，大多数angularjs默认服务都会触发$digest（例如，在执行成功/错误方法后，通过

$http

的任何网络请求都会触发

$digest

）