javascript - angular.foreach在发送get请求时给我重复的数据

我的代码可以正常工作，但是它给了我重复的数据，我似乎找不到解决方案。

这是我的代码。

vm.peoplev2值

vm.peoplev2 = [{'userId': 'admin'},{'userId':'jonas'},{'userId':'maria'},{'userId':'johncena'},{'userId':'lorenz'}];

控制者

angular.forEach(vm.peoplev2, function (value, key) {
      console.log(value.userId);
      uploadService.getCurrentImg(value.userId).then(function (data) {
        if (value.userId === data.data.user) {
          vm.img.push(data.data);
          console.log(vm.img);
        }
   });
});

uploadService

function getCurrentImg(data) {
   return $http.get('/api/img/' + data );
}

路线

router.get('/img/:id', function (req, res) {
    Img.findOne({ user: req.params.id }, function (err, img) {
        if (err) {
            res.status(404).send(err);;
        } else {
            res.status(200).send(img);
        }
    });
});

这是vm.img（object）中的结果：



它正在获取jonas和lorenz 2x。如何解决这个问题？

最佳答案

异步操作和循环可能是不可预测的。尝试以下方法：

（用$timeout调用替换服务中的$http）

angular.module('plunker', [])
.service('service', function($timeout) {
  this.get = function(person) {
    return $timeout(() => {
      return {
        '_id': ~~Math.random(),
        'name': person.userId
      }
    }, 250)
  }
})
.controller('MainCtrl', function(service, $q) {
  this.peoplev2 = [{
    'userId': 'admin'
  }, {
    'userId': 'jonas'
  }, {
    'userId': 'maria'
  }, {
    'userId': 'johncena'
  }, {
    'userId': 'lorenz'
  }];

  $q.all(this.peoplev2.map(person => service.get(person)))
  .then(results => {
    console.log(results)
  })
});

这将创建一个promise数组，并等待所有内容执行后再返回最终结果。

Plunk

关于javascript - angular.foreach在发送get请求时给我重复的数据，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/47804881/