带有 $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');}); }

我放了两个alerts 来显示我用来检索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

问题：

Don't make functions inside of a loop ...

函数的每次调用实际上都引用了内存中i 的同一个副本。每次 for 循环运行时都会创建一个新的闭包，但每个闭包都捕获相同的环境。因此，每次调用 $http.get（一个异步函数）都会触发一个回调，该回调引用了循环结束时的 i 的相同 final 值。

解决方案：

将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);
}

Demo

这真的很难理解，但值得花时间深入了解。它不仅可以帮助您避免以后出现类似的问题，还可以让您更好地理解闭包，这是 JavaScript 中的一个重要概念。

Answer 2

第三个警报在您的$http.get 承诺的error 回调中。只有在请求失败时才会执行。如果请求通过，则执行前两个警报，如果请求失败，则启动第三个警报。