在使用http.get()迭代调用url并使用$q.all()解析时

In calling URLs iteratively using http.get() and resolving using $q.all()

本文关键字：all 调用 get http 迭代 url      更新时间：2023-09-26

我正在实现这个场景，我必须迭代地从多个url获取数据，并使用一些业务逻辑处理它并在屏幕上显示。我在控制器中实现这一点，因为它是一个要求。一切都很好，直到第1部分，我得到了promises数组中的6个承诺对象。但是，我没有把数据放入metricData。在浏览器中运行时，我在控制台中看到null。我确信数据来自URL响应。我觉得我在$q.all方法中做了一些愚蠢的事情。这是正确的吗?

var calculateMutationsInDepth = function(){
        //Part-1
        var promises=[];
        var metricData=[];
        for(var depth=0 ; depth<6 ; depth++){
                var resourceUrl = urlService(depth);
                promises.push($http.get(resourceUrl)
                                  .then(function(response){
                                    return response.data;
                                    },function(status){
                                        return status;
                                }));
                           }
        //Part-2 Resolving the promise array below              
         $q.all(promises).then(function(data){
                        for(var eachResult=0; eachResult < data.length; eachResult++){
                            if(null != data[eachResult]){
                                var eachDataObject = data[eachResult];
        //For debugging         console.log(eachDataObject);
                                    for(var objCount=0; objCount < eachDataObject.length; objCount++){
                                        if(eachDataObject[objCount].scope === "PRJ" || eachDataObject[objCount].scope === "FIL")
                                            metricData.push(eachDataObject[objCount]);
                                    }
                            }
                        }
     });
        if(metricData != null){
                analyzeMutationData(metricData); //Calling a function with the aggregated data array where business logic is present
            }
};
calculateMutationsInDepth();     //Calling the above function

是的，一些愚蠢的事情。

如前所述，analyzeMutationData(metricData)是同步调用的，而metricData是在$q.all(promises).then()回调中异步填充的。

同样，错误处理程序function(status){ return status; }也不合适。:

  • 完全省略错误处理程序，并允许任何单个$http错误阻止第2部分中的进一步处理，或者
  • return null，允许在第2部分中进行处理，并在第2部分中进行if(dataObject != null)测试，以过滤掉任何此类错误。

下面是修改后的代码，加上一些其他的修饰，并演示了如果calculateMutationsInDepth()返回一个promise可以做什么。

var calculateMutationsInDepth = function() {
    //Part-1
    var depth, promises = [];
    for(depth=0; depth<6; depth++) {
        promises.push($http.get(urlService(depth))
        .then(function(response) {
            return response.data;
        }, function(error) {
            return null; // error recovery - `dataObject` below will be null
        }));
    }
    //Part-2 Aggregate the promises, extract metric data and apply business logic
    return $q.all(promises).then(function(data) { // note `return` here
        var dataObject, i, j, metricData = [];
        for(i=0; i<data.length; i++) {
            dataObject = data[i];
            if(dataObject != null) {
                for(j=0; j<dataObject.length; j++) {
                    if(dataObject[j].scope === "PRJ" || dataObject[j].scope === "FIL") {
                        metricData.push(dataObject[j]);
                    }
                }
            }
        }
        // Analyse here, inside the .then()
        if(metricData.length > 0) { // metricData is an array and will never be null, therefore test metricData.length.
            return analyzeMutationData(metricData);
        }
        return null;
    });
};
calculateMutationsInDepth().then(function(analysis) {
    // all complete
    // `analysis` is either null or whatever `analyzeMutationData(metricData)` returned.
}).catch(function(error) {
    console.log(error);
});

希望这对你有所帮助!如果没有，请告诉我

相关文章：