帶有$ http.get的`while`或`for`循環

Question

我想知道，如果它可以使用while或for與嵌套調用$http.get ：

這是一個例子：

for (var i = 0; i < $scope.comments.length; i++) {
   alert($scope.comments[i].id); // = 2
   $http.get('/api/logged/like/isliked?id=' + $scope.comments[i].id).success(function(data, status, header, config) {
        alert('Test');
        alert($scope.comments[i].id); // Not executed.
   }).error(function(data){alert('The requeste isn't working');}); }

我放了兩個alert來顯示我用來檢索JSON的評論的ID。 我得到第一個警報的id，然后第二個警告“測試”，但第三個警報沒有顯示。 為什么不？

這是JSON的一個例子：

{data":[
   {"id":2,"is_liked":false,"nb_comments":1,"nb_likes":1,
    "date_creation":"2014-05-26T17:03:54+0000"},
   {"id":1,"is_liked":true,"nb_comments":0,"nb_likes":1,
    "date_creation":"2014-05-26T17:00:26+0000"}
]}

Answer 1

問題：

不要在循環中創建函數 ......

函數的每次調用實際上都是在內存中引用i的相同副本。 每次for循環運行時都會創建一個新的閉包，但每個閉包捕獲相同的環境。 因此，每次調用$http.get （異步函數）都會導致從循環結束引用i的相同最終值的回調觸發。

一個辦法：

將i作為參數傳遞給單獨定義的函數：

var getIsLiked = function(i){
  $http.get('isliked.json' + $scope.comments[i].id)
    .success(function(data) {
      console.log('Test');
      console.log('i is ', i);
      console.log($scope.comments[i].id);
  }).error(function(data){console.log("The request isn't working");}); }
}

for (var i = 0; i < $scope.comments.length; i++) {
  getIsLiked(i);
}

演示

這可能真的難以理解，但是值得深入了解。 它不僅可以幫助您避免將來出現類似問題，還可以讓您更好地理解閉包，這是JavaScript中的一個重要概念。

Answer 2

第三個警報位於$http.get promise的error回調中。 只有在請求失敗時才會執行它。 如果請求通過則將執行第一個警報，如果請求失敗則將啟動第三個警報。