AngularJS HTTP 요청을 기다리는 중

Question

내 웹 사이트에서 API 액세스를위한 http 요청을하고 있습니다. 키 누름 이벤트를 트리거합니다. 문제는 각 연속 키 프레스에서 많은 아약스 호출을 생성하므로이 컨트롤을 위해 300 밀리 초와 같은 작은 타임 아웃을 추가해야합니다. 다음과 같이 http 호출을했습니다. 어떻게 수정할 수 있습니까? $ 제한 시간 함수 내에서 함수를 감싸

var req = { 
    method: 'GET', 
    url: 'url of api', 
    headers: { 
     "Key": "keyofapi", 
     "Accept": "application/json" 
    }, 
}; 

$http(req) 
    .success(function(data, status, headers, config) { 
    }) 
    .error(function(data, status, headers, config) { 
    }); 

Answer 1

는 제한 시간 (P.S 는 MS의 값을 사용)을 언급. 컨트롤러 매개 변수에 $ timeout을 삽입하는 것을 잊지 마십시오.

$timeout(function() { 
     $http({ 
       method: 'POST', //No I18N 
       url: 'your URL', //No I18N 
       params: { 
        parameters if needed 
       } 
      }).success(function (data, status, headers, config) { 
       //Do the required 
      }); 
     }, 2500); 

Answer 2

내가 실제로 활성 요청이 있고 기다리고 경우보고 공장이나 서비스를 수행하는 것이 좋습니다,이보십시오.

yourApp.factory('apiReqeust', ['$http', function($http) { 
    // If you want to complete all requests that you sending, 
    // make this varable an empty array and push every new request inside it. 
    var waitingRequest = null; // Or quenuedRequests = []; 
    var isWorking = false; 
    // In my case I will not make an array, and will have only one request that will wait. 
    // I mean the last attempted request. 
    // This is perfect for an Autocomplete API 

    function request(options, callback) { 
    if (isWorking) { 
     // If you are already running request at this time. 
     // Replace waiting request with this one. (this one is newer request) 
     waitingRequest = {options: options, callback: callback} 
     // EDIT! I forgot about the return statement. 
     // You need to stop, otherwise the request will be executed anyway. 
     return; 
    } 
    isWorking = true; 

    $http(options).success(function(data) { 
     // When the request ends, tell that you are not working 
     // So you can execute next request immediately 
     isWorking = false; 

     // execute callback with data parameter. 
     callback(data); 

     // If you have waiting request yet. execute it. 
     if (waitingRequest) { 
     request(waitingRequest.options, waitingRequest.callback); 

     waitingRequest = null; 
     } 
    }).error(function(err) { 
     isWorking = false; 
     callback(null, err); 
     if (waitingRequest) { 
     request(waitingRequest.options, waitingRequest.callback); 
     } 
    }); 
    } 
    return request; 
}); 

이것의 사용법은 다음과 같습니다

// Factory or controller or whatever that can depend on above factory 
youApp.factory('another-whatever', ['apiRequest', function(apiRequest) { 
    options = {'Some': 'HttpOptions'}; 
    apiRequest(options, function(data, err) { 
    if (err) throw new Error(err); 
    // And here you doing what you want with the data. 
    }); 
}]); 

이 코드를 테스트하고 있지 않다. 작동하는지 모르겠습니다. 그러나 당신이 그 아이디어를 얻길 바랍니다.

Answer 3

실제로 요청한 제품과 대기중인 제품을 지켜 보는 공장이나 서비스를 실제로하는 것이 좋습니다.

function request(options, callback) { 
    if (isWorking) { 
     // If you are already running request at this time. 
     // Replace waiting request with this one. (this one is newer request) 
     waitingRequest = {options: options, callback: callback} 
     // EDIT! I forgot about the return statement. 
     // You need to stop, otherwise the request will be executed anyway. 
     return; 
    } 
    isWorking = true; 

    $http(options).success(function(data) { 
     // When the request ends, tell that you are not working 
     // So you can execute next request immediately 
     isWorking = false; 

     // execute callback with data parameter. 
     callback(data); 

     // If you have waiting request yet. execute it. 
     if (waitingRequest) { 
     request(waitingRequest.options, waitingRequest.callback); 

     waitingRequest = null; 
     } 
    }).error(function(err) { 
     isWorking = false; 
     callback(null, err); 
     if (waitingRequest) { 
     request(waitingRequest.options, waitingRequest.callback); 
     } 
    }); 
    } 
    return request; 
}); 

이의 사용법은 다음과 같습니다

// Factory or controller or whatever that can depend on above factory 
youApp.factory('another-whatever', ['apiRequest', function(apiRequest) { 
    options = {'Some': 'HttpOptions'}; 
    apiRequest(options, function(data, err) { 
    if (err) throw new Error(err); 
    // And here you doing what you want with the data. 
    }); 
}]); 

당신이 요구하고 정확히 무엇