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

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

我正在实现这个场景,我必须从多个 URL 中迭代获取数据并使用一些业务逻辑处理它并显示在屏幕上。我正在控制器中实现它,因为这是一项要求。在第 1 部分之前一切都很好,我在 promises 数组中获得了 6 个 promise 对象。但是,我没有将数据输入 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() returns 承诺可以做什么。

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

希望this对您有所帮助!如果没有,请告诉我。