AngularJS长轮询视图未更新

时间:2016-01-22 15:50:32

标签: javascript angularjs long-polling

我试图在angularjs app中使用长轮询。我在控制器中进行长轮询,该控制器正在更新视图中引用的范围变量。 当我单步执行代码时,正在进行轮询并返回预期的数据,但视图永远不会更新。

longpolltest.js

var myApp = angular.module('myApp', []);

myApp.controller('MyController', function($scope, $timeout) {
    $scope.value = 1;
    function poll() {
        var d = new Date();
        var n = d.getTime();
        $scope.value++;
        $.ajax({
            type: 'GET',
            url: '/gs/async?millis=' + n,
            contentType: "application/json; charset=utf-8",
            async: true,
           cache: false,
           success: function(data) {
               var obj = jQuery.parseJSON(data);
               if (obj.type == 'ServerTime')
                   $scope.myTime = object.Data.Time;
               setTimeout("poll()", 1000);
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                alert("error: " + textStatus + " " + errorThrown);
                setTimeout("poll()", 10000);
            }
        });
    }
    poll();
 });

longpolltest.html

<!DOCTYPE html>
<html>
<head lang="en">
    <!-- jQuery JavaScript -->
    <script src="js/ext/jquery-1.12.0.min.js"></script>

    <!-- angular library -->
    <script src="js/ext/angular/angular.min.js"></script>

    <script src="js/ext/angular/angular-route.min.js"></script>

    <script src="js/longpolltest.js"></script>

    <meta charset="UTF-8">
    <title>Long poll test</title>
</head>
<body ng-app="myApp">
<div>
    <div ng-controller="MyController">
        <p>
            Time: {{myTime}}
            Poll#: {{value}}
        </p>
    </div>
</div>
</body>

任何想法为什么视图都不会得到更新将非常感激。

提前致谢。

2 个答案:

答案 0 :(得分:0)

一些一般性建议:

  • 不要使用jquery http方法。你应该更喜欢$ http angular service。
  • 不要使用超时功能。您应该更喜欢$ timeout angular service。
  • 不要在控制器内调用http远程服务。你应该创建一个专门的服务。

答案 1 :(得分:0)

进一步的改进可以是使用$ interval服务