Mapping multiple http requests nested in one http.get

Question

My API has a get method that exposes 4 objects that contain 1 href in each, i need to make 4 get requests with the href's after doing the first GET

API contract

{
  "tipoDocumentoCliente": "CPF",
  "documentoCliente": "9687023767",
  "nomeCliente": "RAFAEL HERMOGENES DE MENDONCA",
  "dataNascimentoCliente": "1982-04-14T00:00:00",
  "sexoCliente": "MASCULINO",
  "estadoCivilCliente": "CASADO",
  "cpfCliente": "9687023767",
  "cnpjCliente": null,
  "celCliente": null,
  "profissaoCliente": "Analista de desenvolvimento de sistemas",
  "rendaCliente": 12000,
  "escolaridadeCliente": null,
  "matricula": 0,
  "contas": {
    "method": "Get",
    "rel": "get-contas",
    "href": "http://localhost:62474/api/v1/Contas/9687023767"
  },
  "enderecos": {
    "method": "Get",
    "rel": "get-enderecos",
    "href": "http://localhost:62474/api/v1/Endereco/9687023767"
  },
  "telefones": {
    "method": "Get",
    "rel": "get-telefones",
    "href": "http://localhost:62474/api/v1/Phones/9687023767"
  },
  "emails": {
    "method": "Get",
    "rel": "get-emails",
    "href": "http://localhost:62474/api/v1/Emails/9687023767"
  }
}

This i how i do a single request to my api

public ObterFundos<T>(cpf: number): Observable<T> {
    return this.http.get<T>(this._calcularFundosUrl + cpf);
}

i have no idea how im going to use the hrefs inside the request

Anshuman Jaiswal · Accepted Answer · 2018-05-23 18:34:07Z

1

You need to subscribe your method first in component then use forkJoin to get and combine data from different URL

component.ts

desiredData: any;

this.service.ObterFundos(<number>).subscribe(res => {
    forkJoin(this.service.getDataFromUrl(res.contas.href), 
                this.service.getDataFromUrl(res.enderecos.href), 
                this.service.getDataFromUrl(res.telefones.href), 
                this.service.getDataFromUrl(res.emails.href)).subscribe(result => {
        res.contas['data'] = result[0];
        res.enderecos['data'] = result[1];
        res.telefones['data'] = result[2];
        res.emails['data'] = result[3];
        this.desiredData = res;
        console.log(this.desiredData);
    });
});

import {forkJoin} from 'rxjs/observable/forkJoin';

service.ts

public ObterFundos<T>(cpf: number): Observable<T> {
    return this.http.get<T>(this._calcularFundosUrl + cpf);
}

getDataFromUrl(url) {
    return this.http.get(url);
}

answered May 23, 2018 at 18:34

Anshuman Jaiswal

5,4621 gold badge31 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Daniel Bezerra De Menezes Over a year ago

Thanks dude, i was already doing something similar, but your implementation is much cleaner than mine! Have a nice day

Collectives™ on Stack Overflow

Mapping multiple http requests nested in one http.get

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related