带有$ http.get的`while`或`for`循环

时间:2014-05-28 21:38:15

标签: javascript angularjs

我想知道是否可以使用whilefor$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,然后是&#39;测试&#39;对于第二个,但第三个警报不显示。为什么不呢?

这里是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"}
]}

2 个答案:

答案 0 :(得分:32)

问题:

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

您的函数的每次调用实际上都是在内存中引用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);
}

Demo

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

答案 1 :(得分:-1)

第三个提醒位于error承诺的$http.get回调中。只有在请求失败时才会执行它。如果请求通过则将执行第一个警报,如果失败则将启动第三个警报。