处理多个同步独立的http请求Angular 2

Question

我正在尝试构建一个 angular 2 应用程序，该应用程序向用户显示多个图表，我在处理多个并行独立 http 请求时遇到了一个真正的问题，当我在 ngOnInit 中调用超过 2 个请求时，我得到了 505 响应。

    this._service.getPlant().subscribe(plants => {
    for (var i = 0; i < plants.length; i++)
        for (var name in plants[i]) {
            this.plants.push(plants[i][name]);
            console.log(plants[i][name]);

        }
    this._service.getDept().subscribe(depts => {

        for (var i = 0; i < depts.length; i++)

            for (var name in depts[i]) {
                this.depts.push(depts[i][name]);
                console.log(depts[i][name])

            }
        this._service.getMachines().subscribe(machines => {
            for (var i = 0; i < machines.length; i++)
                for (var MachineName in machines[i]) {
                    machines.push(machines[i][MachineName]);
                    // console.log(machines[i][MachineName]) ;
                }
        });
    });
});

Answer 1

您在subscription 中输入所有服务调用，而不是让它们独立，如下所示，

this._service.getPlant().subscribe(plants => {
    for (var i=0; i<plants.length; i++)
        for (var name in plants[i]) {
            this.plants.push(plants[i][name]);  
            console.log(plants[i][name]) ;
        }
});
this._service.getDept().subscribe(depts => {
    for (var i=0; i<depts.length; i++)
        for (var name in depts[i]) {  
            this.depts.push(depts[i][name]);
            console.log(depts[i][name])
        }
});
this._service.getMachines().subscribe(machines => {
    for (var i=0; i<machines.length; i++)
        for (var MachineName in machines[i]) {
                machines.push(machines[i][MachineName]);  
                // console.log(machines[i][MachineName]) ;
        }
 });

根据评论更新：

完成前一个请求后提出另一个请求

ngOnInit(){
    this._service.getPlant().subscribe(plants => {
        for (var i=0; i<plants.length; i++)
            for (var name in plants[i]) {
                this.plants.push(plants[i][name]);  
                console.log(plants[i][name]) ;
            }
    },(error)=>{},
        ()=>{
        /////////////////////////////
        // Completion event handler
        /////////////////////////////
            this.getDepartments();
        });

    private getDepartments(){
        this._service.getDept().subscribe(depts => {
            for (var i=0; i<depts.length; i++)
                for (var name in depts[i]) {  
                    this.depts.push(depts[i][name]);
                    console.log(depts[i][name])
                }
        },(error)=>{},
        ()=>{
        /////////////////////////////
        // Completion event handler
        /////////////////////////////
            this.getMachines();
        });
    }
    private getMachines(){

        this._service.getMachines().subscribe(machines => {
            for (var i=0; i<machines.length; i++)
                for (var MachineName in machines[i]) {
                        machines.push(machines[i][MachineName]);  
                        // console.log(machines[i][MachineName]) ;
                }
         });
    }
}