Question

我正在尝试发出http请求并将返回的结果放入我的数组中。

我有类似

的东西

控制

for (var i=0; i < numOfProduct.length; i++) {
   productFactory.makeRequest(numOfProduct[i].id)
                    .then(function(data) {
                        console.log(i)
                        //always output 10 which is my numOfProduct.length

                        numOfProduct[i].push({detail: data}); 
                        //i got Cannot read property 'push' of undefined error
                    })
                $scope.numOfProduct = numOfProduct;
}

productFactory

service.makeRequest = function(id) {
    return $http.get('/api/product/get' + id);
}

return service;

我的目标是将http请求结果作为对象推送到每个numOfProduct元素中。但是，我似乎无法使用我的http请求代码。任何人都可以帮我吗？非常感谢！

Answer 1

上面有两个问题：

1是一个常见的回调问题，您绑定对i的引用，但不绑定i的值。因此，当您的回调被调用时，循环将结束，并且i将在您绑定的所有回调中为10。

解决此问题的一种方法是通过函数调用强制评估i：

function makeCallback(productId) {
 productFactory.makeRequest(productId)
                    .then(function(data) {
                        console.log(i)
                        return ({detail: data}); 
                    });
}

第二个问题是您在数组.push中的特定值上调用numOfProduct而不是实际数组。（除非该特定值是一个数组，我假设它不是因为你在值上调用.id）

请改为尝试：

function makeCallback(productId) {
     productFactory.makeRequest(productId)
                        .then(function(data) {
                            console.log(i)
                            return ({detail: data}); 
                        })
}
var array = [];
for (var i=0; i < numOfProduct.length; i++) {    
    array.push(makeCallback(numOfProduct[i].id));
}
$scope.numOfProduct = array;

如果每个循环都是异步运行，那么我建议使用流行的async libary。如果您需要任何帮助，请告诉我。

在我的例子中如何获得多个http请求结果？

1 个答案: