CODEWITHSUNDEEP
typescriptrxjs
MeltedStack
MeltedStack

Reputation: 3

how convert response object property from array in to request rxjs

API returns an array of JSON Objects.

[
{
    "vacancy": "61a6597b0dc105d6e79a1f30",
    "createdBy": "61aa11644afa183fa28b0792",
    "executor": "61aa20ee25ef06b69920a505",
    "reviewer": "61aa11644afa183fa28b0792",
    "status": "Invited",
    "_id": "61aa213aeaf2af804aa1e591",
    "createdAt": "2021-12-03T13:52:58.772Z",
    "updatedAt": "2021-12-03T13:52:58.772Z"
},
...
]

And I need convert some propertys in to objects by making get request with value. Something like that:

this.http.get<Application>(
      `${environment.API_ENDPOINT}/applications/assigned?status=completed`
    ).pipe(
        map(aplication => 
{
...aplication,
vacancy:this.http.get(`${environment.API_ENDPOINT}/vacancys/`+ aplication.vacancy),
executor:this.http.get(`${environment.API_ENDPOINT}/candidates/`+ aplication.executor)
}
    )

Upvotes: 0

Views: 197

Answers (1)

BizzyBob
BizzyBob

Reputation: 14750

You need to use a "Higher Order Mapping Operator", which will internally subscribe to an observable and emit its emissions.

In your case, switchMap will work for this. Since you need to make two different calls, we can use forkJoin to create an observable that will emit both results when they are received:

myObj$ = this.http.get<Application>('/applications/assigned').pipe(
    switchMap(aplication => forkJoin({
        vacancy  : this.http.get(`environment.API_ENDPOINT}/vacancys/${vacancy}`),
        executor : this.http.get(`environment.API_ENDPOINT}/candidates/${executor}`)
    }).pipe(
        map(({vacancy, executor}) => ({...aplication, vacancy, executor})
    ))
);

Upvotes: 2

Related Questions