如何在角js中製作同步http請求

如何在AngularJS中阻止http請求，以便我可以在下一行使用$ http響應？如何在角js中製作同步http請求

在下面的例子中，$http對象不將結果返回到下一行，這樣我可以將此結果傳遞給fullcalender()，一個JavaScript庫，因爲$scope.data返回空值。

這是示例代碼：

$http.get('URL').success(function(data){ 
    $scope.data = data; 
}); 

$.fullCalender({ 
    data: $scope.data 
});

來源

2014-11-05 Dipak

有什麼辦法可以避免這種情況？ Javascript是單線程的，並且在等待響應時發出同步HTTP請求會阻止整個瀏覽器。這不應該是您的首選解決方案。 – GregL 2014-11-05 06:16:13

您不能簡單地將調用移動到fullCalendar到成功回調並設置數據等於回調的數據參數？ – Scott 2014-11-05 06:17:00

當我在回調中使用fullcalendar數據時，它不顯示在模板上。 – Dipak 2014-11-05 06:24:59

您可以使用promises。

這裏有一個例子：

$scope.myXhr = function(){ 

    var deferred = $q.defer(); 

    $http({ 
     url: 'ajax.php', 
     method: 'POST', 
     data:postData, 
     headers: {'Content-Type': 'application/x-www-form-urlencoded'} 
     }) 
     //if request is successful 
     .success(function(data,status,headers,config){ 

      //resolve the promise 
      deferred.resolve('request successful'); 

     }) 
     //if request is not successful 
     .error(function(data,status,headers,config){ 
      //reject the promise 
      deferred.reject('ERROR'); 
     }); 

    //return the promise 
    return deferred.promise; 
} 

$scope.callXhrAsynchronous = function(){ 

    var myPromise = $scope.myXhr(); 

    // wait until the promise return resolve or eject 
    //"then" has 2 functions (resolveFunction, rejectFunction) 
    myPromise.then(function(resolve){ 
     alert(resolve); 
     }, function(reject){ 
     alert(reject)  
    }); 

}

來源

2014-11-05 08:16:07 Giwwel

不返回'$ http'創建的promise的原因是什麼？ IT是一個糟糕的做法，以延遲現有的承諾 – 2015-07-15 21:53:58

由於'$ http'創建的承諾是異步 – stevemao 2015-07-16 04:03:26

+63

我想知道爲什麼這被接受爲答案。 OP詢問**同步**，並且你回答**異步** – KingJulian 2015-07-27 18:37:27

你不能，你會通過的承諾需要處理它，但你可以嘗試做這樣的：

$http.get('URL').success(function(data){ 
    angular.copy(data, $scope.data); 
}); 

$.fullCalender({ 
    data: $scope.data 
});

但最人們只會這樣做

$http.get('URL').success(function(data){ 
    $.fullCalender({ 
     data: data 
    }); 
});

如果無論您的fullCalender對象是否不適用於異步數據，您可能需要將其包裝在ng-if之類的東西中，或者在數據被提供時強制它重繪。您也可以強制控制器在數據通過使用路徑解析加載之前不加載。

來源

2014-11-05 06:19:32 John

這裏是一個實用的答案，用戶Kirill Slatin禮貌誰張貼的答案的評論。答案底部的實際使用示例。

如果像我一樣，你需要使用響應對象的範圍變化，這應該工作：

$http.get('URL').success(function(data){ 

$scope.data = data; 
$.fullCalender = $scope.data; 
$scope.$apply() 
});

$scope.$apply()是什麼將持續響應對象，所以你可以使用這些數據。

爲什麼你需要做到這一點？

我一直在嘗試爲我的食譜應用程序創建一個「編輯」頁面。我需要使用所選配方的數據填充我的表單。做了我的GET請求，並將響應數據傳遞給$ scope.form後，我什麼都沒有... $scope.$apply()和Kirill Slatin幫助大的時間。隊友的歡呼聲！

這裏的例子來自我editRecipeController：

$http.get('api/recipe/' + currentRecipeId).then(
    function (data) { 
     $scope.recipe = data.data; 
     $scope.form = $scope.recipe; 
     $scope.$apply() 
    } 
);

希望幫助！

來源

2016-11-14 16:48:56 Bptstmlgt

如何在角js中製作同步http請求

回答

相關問題