为什么setTimeout会阻止递归$ http.get调用

时间:2013-09-19 12:54:42

标签: javascript jquery angularjs

我在这里看过SO和谷歌搜索它但我很难找到任何解决方案。

我有以下功能,当我不使用setTimeout()功能并只调用我的轮询功能时,它按预期工作。但是当我尝试将我的轮询函数包装在setTimeout()中时,它会工作一次然后再次调用,除非页面被刷新,我已经在GET请求中包含了一个时间戳,以防止使用缓存的响应我认为这不是问题。我也检查过,这种行为发生在IE9,Firefox和Chrome中。

$scope.progressPolling = function () {
    var time = new Date().toString();
    console.log("time :" + time);

    $http.get('pollprogress?time=' + time + '&id=' + $scope.jobID)
        .success(function (data, status, headers, config) {
            var percent = data.percentage;
            if (parseInt($scope.progress) < 100) {
                if (percent <= 100) {
                    $scope.progress = percent;
                }
                setTimeout(function() {
                    if (parseInt($scope.progress) < 100) {
                        temp = parseInt($scope.progress) + 1;
                        $scope.progressPolling();
                    };
                }, 5000);
            }
        })
        .error(function (data, status, headers, config) {
            console.log("Error updating Progress: " + data);
        });
}

2 个答案:

答案 0 :(得分:1)

尝试将其更改为$timeout

$scope.progressPolling = function () {
var time = new Date().toString();
console.log("time :" + time);

var stop;

$http.get('pollprogress?time=' + time + '&id=' + $scope.jobID)
    .success(function (data, status, headers, config) {
        var percent = data.percentage;
        if (parseInt($scope.progress) < 100) {
            if (percent <= 100) {
                $scope.progress = percent;
            }
           stop = $timeout(function() {
                if (parseInt($scope.progress) < 100) {
                    temp = parseInt($scope.progress) + 1;
                    $scope.progressPolling();
                }
                   else{
                     $timeout.cancel(stop);
                   }
            }, 5000);
        }
    })
    .error(function (data, status, headers, config) {
        console.log("Error updating Progress: " + data);
    });
}

作为旁注,请创建工厂:

 myModule.factory('delay', ['$q', '$timeout', function ($q, $timeout) {
 return {
    start: function () {
        var deferred = $q.defer();
        $timeout(deferred.resolve, 5000);
        return deferred.promise;
      }
   };
 }]);

之后你可以这样称呼它:

$q.all([delay.start(), /*your method */]);`

答案 1 :(得分:1)

setTimeout似乎不起作用的原因是因为回调函数在摘要周期之外执行,因此绑定不会更新。 $timeout服务使用$scope.$apply(...)包装调用,以便更新UI。您可以在setTimeout回调中自行完成。