AngularJS ngcontroller定期重新加载数据

一尘不染

AngularJS ngcontroller定期重新加载数据

angularjs

我在angularJS应用程序中有此工作实现，该应用程序从URL获取一些链接并绘制它们。但是，URL上的链接会不断更新，我想定期更新此$
scope.listlinks，比如说每10秒更新一次。

我试过没有运气的setInterval。

Java脚本

var App = angular.module('App', []);
App.controller('ListLinksCtrl', 
function get($scope, $http ) {
  $http.get('http://example_url.com/my_changing_links_json').then(
       function(res){$scope.listlinks = res.data;});
}
);

的HTML

<div id="cnt1" ng-controller="ListLinksCtrl">
   <div ng-repeat="singlelink in listlinks">
        <a href="{{ singlelink.url }}"> 
           {{ singlelink.destination }} 
        </a>
   </div>
</div>

阅读 248

2020-07-04

共1个答案

一尘不染

尽管jvandemo的答案会起作用，但我认为可以稍作改进。通过使用setInterval，它打破了Angular遵循的依赖项注入约定，并使控制器的单元测试变得困难。

Angular当前不setInterval通过其内置服务支持，但是您可以使用该$timeout服务来产生相同的功能。我将控制器更改为此：

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();

});

2020-07-04