如何使用AngularJS定期轮询远程json？

Question

客户端读取远程json：

app.controller("StatusController", function($scope, $http) {

  $http.defaults.headers.common["X-Custom-Header"] = "Angular.js";
  $http.get('https://example.com/status.json').
    success(function(data, status, headers, config) {
      $scope.status = data;
    });

});

目前，用户通过重新加载网页来刷新状态。如何设置定时器（例如，每2秒）轮询数据并自动刷新？

Answer 1

您可以使用setInterval()：

app.controller("StatusController", function($scope, $http) {

  $http.defaults.headers.common["X-Custom-Header"] = "Angular.js";

  this.interval = setInterval(function(){$http.get('https://example.com/status.json').
    success(function(data, status, headers, config) {
      $scope.status = data;
    });}, 2000);

  this.endLongPolling = function(){ clearInterval(this.interval);};

});

setInterval()将持续执行每隔一段时间传递给它的函数（2000毫秒=== 2秒），直到调用clearInterval()为止。在上面的示例中，我将展示如何清除endLongPolling中的间隔。

事实上，有角度的家伙已​​经为此服务了; $interval。

$interval(fn, delay, [count], [invokeApply])

应用于您的方案，它将是：

app.controller("StatusController", function($scope, $http, $interval) {

  $http.defaults.headers.common["X-Custom-Header"] = "Angular.js";

  this.interval = $interval(function(){
    $http.get('https://example.com/status.json').
      success(function(data, status, headers, config) {
        $scope.status = data;
  });}, 2000);

  this.endLongPolling = function(){ $interval.cancel(this.interval);};

});