javascript - 使用 $q.all 在 Promise 中调用 Promise

Question

这个问题已经有答案了:

multiple promises running in parallel, $q.all needs chaining? (1 个回答)

已关闭 6 年前。

我有多个可以并行运行的 API 请求。

getlocations、getstates、get Territory 可以并行发出请求。然而，一旦我从 getstates() 调用中获得了状态列表，我需要为每个单独的状态发出 api 请求并解析状态对象。

这是我到目前为止的代码，以这种方式在 promise 中调用 promise 可以吗？

  getAllLocations() {
    //make a promise call for all here .
    var promise = [];
    //first prmise
    promise.push(this.getAllLocations(Id).then(
        (locationsData) => {
            this.locations = locationsData;
        }));
    //second promise
    promise.push(this.getAllStates(Id).then(
        (resp) => {
            this.states = resp.data;
            //for each state , need to make an api call and add to the state info
            angular.forEach(this.states, function(state){
                var nodeId = state.Id;
                this.getStateSummary(nodeId).then((resp) => {
                    state.healthStatus = resp.data.operationalStatus;
                });
            },this)
        }));
    //third promise
    promise.push(this.getAllterritories(Id).then(
        (resp) => {
            this.territories = resp.data;
        }));
    //after all promises parse teh location data
    $q.all(promise).then(() => {
        for (var i = 0; i < this.locations.length; i++) {
            //do something with with location here
        }
        this.gridData = this.locations;
    });
}

如果没有，调用 getStatesummary() 的最佳方法是什么？

Answer 1

我会简化 3 个 promise 中的每一个(尤其是 1 和 3)，以便 this.locations、this.states 和 this.territories 都在 $q.all .then 中更新 - 你不必，但我认为这使代码更具可读性

接下来，将所有 3 个 Promise 分配给一个变量(下面代码中的 p1、p2、p3)

下一个问题是等待所有状态 API 调用完成 - 那里需要另一个 $q.all

总而言之，再加上一点额外的 ES6 优点，你就得到了

getAllLocations() {
    //first prmise
    const p1 = this.getAllLocations(Id);
    //second promise
    const p2 = this.getAllStates(Id).then(resp => 
        //for each state , need to make an api call and add to the state info
        $q.all(resp.map(state => this.getStateSummary(state.Id).then(resp => state.healthStatus = resp.data.operationalStatus)))
        .then(() => resp) // so we return data for this.states
    );
    //third promise
    const p3 = this.getAllterritories(Id).then(resp => resp.data);
    //after all promises parse teh location data
    $q.all([p1, p2, p3]).then(([locations, states, territories]) => {
        this.locations = locations;
        this.states = states;
        this.territories = territories;
        for (var i = 0; i < locations.length; i++) {
            //do something with with location here
        }
        this.gridData = this.locations;
    });
}

如果 getAllStates Promise 返回一个对象，而不是我假设的数组 - 则将内部 $q.all 替换为

        $q.all(Object.entries(resp).map(([key, state]) => this.getStateSummary(state.Id).then(resp => state.healthStatus = resp.data.operationalStatus)))

实际上，上面的代码同样适用于数组或对象:p