处理多个同步独立的http请求Angular 2 [英] Handle multiple synchronous independent http request Angular 2

问题描述

我正在尝试构建一个角度2应用程序，该应用程序向用户显示多个图表，并且在处理多个并行独立的http请求时遇到了一个真正的问题，当我在ngOnInit中调用两个以上的请求时，我得到了505响应. /p>

I'm trying to build an angular 2 application which shows multiple charts to users and i'm facing a real problem with handling multiple parallel independent http request , i got 505 response when i call more then 2 requests in 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]);

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

推荐答案

您正在subscription内键入所有服务调用，而应按如下所示将它们独立，

You are typing up all service calls inside the subscription instead you should have them independent as below,

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

这篇关于处理多个同步独立的http请求Angular 2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！