如何在不重新加载页面的情况下使用Angularjs轮询新数据

时间:2014-08-04 08:46:08

标签: angularjs real-time angular-http

我是Angular的新手,请原谅我的无知,但是我正试图让我的头脑如何实时轮询数据而不重新加载页面,所以一切都会在后台发生。我正在使用setInterval来获取每5000毫秒的数据,但据我所知,这对于浏览器而言是昂贵的,因为我不断加载json文件。

如果服务器上有新数据,观看或获取的最佳解决方案是什么?因此,当json文件与新用户(朋友)一起更新时,页面将提供新数据,而无需重新加载页面或按下按钮进行刷新。我基本上是在寻找实时的。

视图:

   <h1>{{title}}</h1>
        <ul>
            <li ng-repeat="friend in friends"><strong>Name: </strong>{{friend.name}} : {{friend.username}}</li>
        </ul>

获取数据的服务:

angular
    .module ('myApp')
    .factory ('Friends', ['$http', function ($http) {
        return {
            get: function () {
                return $http.get ('users.json').then (function (response) {  
                    return response.data;
                });
            }
        };
    }]);

控制器:

angular
    .module ('myApp')
    .controller ('summaryCtrl', ['$scope', 'Friends', function ($scope, Friends) {
        $scope.title = "Friends";
        $scope.loadData = function () {
            Friends.get ().then (function (data) {
                $scope.friends = data;
            });
        };

        //initial load
        $scope.loadData();

        var timer = setInterval(function(){
            $scope.loadData();

        },5000);

    }]);

非常感谢您的帮助,如果问题没有任何意义,请再次感到抱歉。

0 个答案:

没有答案