I have an angular2 app. I am using resolve to get some data before navigating to a route.

I was doing this in the route:

resolve: {
        businessRules: NewEventResolverService,
        countries: NewEventCountriesResolverService,
        locations: NewEventLocationsResolverService
}

Each of these services sends a GET request to my Rails API server (Rails 5). So, when I was navigating to the said route, the rails server would hang and wasn't returning any data.

Then I changed it to only one resolver service:

resolve: {
        allPrerequisites: NewEventResolverService
}

And in the resolver service, sent the GET request one after the other.

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<any> {
    return this.service.getActiveBusinessRule().then((lookupRecords: LookupKeyValuePair[]) => {
        return this.service.getActiveCountries().then((countries: Country[]) => {
            return this.service.getActiveLocationsOfClient().then((locations: Location[]) => {
                return {
                        lookupRecords: lookupRecords,
                        countries: countries,
                        locations: locations
                }
            })
        })
    })
}

This time the server didn't hang. How do I make it work with multiple concurrent requests to the rails server?