【问题标题】:AngularJS: Send $http.get requests continuously until certain conditionAngularJS:持续发送 $http.get 请求直到特定条件
【发布时间】:2017-01-06 22:23:47
【问题描述】:

正如标题所说,我想向服务器发送$http.get请求,直到返回的结果满足条件。

这是我尝试过的:

    var searchComplete = false;
    var sendGetReq = true;

    while(!searchComplete) // #2 and then jumps here
    {
       if(sendGetReq)
       {
         sendGetReq = false;  // #1 execution reaches here
         $http.get('/user/getCondition', {params: {condition: $scope.condition}).
        success(function (condition, status, headers, config) {
         ...
         ...
         if(condition)
         { searchComplete = true; }
         else
         { sendGetReq = true; }
    }
}

但是,$http.get 请求永远不会执行。该声明从未达到。调试的时候看到执行会到sendGetReq=false,然后跳转到while(!searchComplete)。永远不会发送 GET 请求。

谁能解释一下:

  1. 为什么执行永远达不到 GET 请求并跳回
  2. 执行此连续 GET 请求的推荐方法是什么

谢谢。

【问题讨论】:

  • 使用.then,而不是.success,你应该让它成为一个递归函数。不要期望同时使用一段时间和承诺的完美行为。让自己成为一个函数,一旦 promise 返回就会调用自己。

标签: angularjs callback get


【解决方案1】:

为什么不把它们放在一个函数中,如果条件满足就调用它自己呢?像这样,你应该使用 .then 而不是 .success:

$scope.load = function(){
  $http.get('/user/getCondition', {params: {condition: $scope.condition}).
    then(function (condition, status, headers, config) {

    if (condition){
       $scope.load();
    }

  });
}

希望对你有帮助 =)

【讨论】:

    【解决方案2】:

    不要使用while (true),尤其是在JS中。

    JS 在一个线程中工作。 $http.get 永远不会运行,因为你的主线程在你的无限循环中停止并且没有给其他线程运行的机会。

    更新

    function getHttpPromise() {
        return $http.get('/user/getCondition', {params: {condition: $scope.condition}).
            success(function (condition, status, headers, config) {
             ...
             ...
             if(condition)
                 return true;//or any result you want to resolve
             else
                 return getHttpPromise();
        }
    }
    

    getHttpPromise 函数返回 promise,它将在您的 condition 上解决,否则它将继续等待后续的 get 请求。

    要使用它,请运行以下代码。

    getHttpPromise().then(function (result) {
        // Will be called only when condition will be successful
    });
    

    【讨论】:

      【解决方案3】:

      $http.get 是异步调用,它会在服务器响应时触发成功或错误(两者都已弃用,然后使用)函数。当函数到达这一行时

      sendGetReq = false;  // #1 execution reaches here
      

      它进行$http.get 调用(这是异步的),然后将控制移至下一次迭代。这就是异步调用的主要目的。

      如果您想进行连续调用,您可以在函数中编写$http.get 调用,并使用Angular JS 的interval 服务调用该函数。

      $interval

      $scope.func = function(){
         if(condition)
         {
            $http.get....
         }      
      }
      
      $interval($scope.func, 1000)
      

      其中 1000 是调用函数的时间间隔(以毫秒为单位)

      【讨论】:

      • 使用$timeout,您只需调用一次该函数。也许您需要$interval,但无论如何都不是一个好的解决方案。您应该使用 then (success) 递归调用您的函数
      • @gianlucatursi 为 $interval 编辑了我的答案
      【解决方案4】:

      尝试在你的控制器中注入$interval

      var startInterval = $interval(function(){
        var searchComplete = false;
        var sendGetReq = true;
      
              sendGetReq = false;  // #1 execution reaches here
              $http.get('/user/getCondition', {params: {condition: $scope.condition}).
              success(function (condition, status, headers, config) {
               if(condition)
               {   searchComplete = true;
                  $scope.stopInterval();
               }
               else
               { sendGetReq = true; }
              })
      
      },1000)
      
      $scope.stopInterval = function(){
         $interval.cancel(startInterval)
      }
      

      【讨论】:

        【解决方案5】:

        正如安德鲁所说,它应该是递归的,在你的情况下使用 .then。为了使其递归,将您的 $http 服务封装在一个函数中

        .controller('YourController', function($http) {
        this.sendGetReq= function(data) {
            $http.get('/user/getCondition', {params: {condition: data.condition}).
            .then(function(res) {
                if (res.condition) {
                //finish your search
                } else {
                //set newdata somehow   
                  this.sendGetReq(newdata);
                }
            }
        };
        

        });

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2013-06-06
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2016-07-21
          相关资源
          最近更新 更多