CODEWITHSUNDEEP
ajaxangularhttpget
Jaime FH
Jaime FH

Reputation: 148

Handle data after http get request in angular

I have a service that requests data from a get method, I'd like to map the response to an object storing some Ids and use those Ids to make other http requests. I was told this isn't usually done in a callback manner, I looked at this How do I return the response from an asynchronous call? but I don't think it's the usual way to implement services, any hints are very appreciated.

Tried adding in onInit/constructor method in angular to be sure the object was filled before other methods were called without success.

@Injectable ()
export class ContactService  {
   storeIds;

   getIds(callback: Function) {
   this.http.get<any>(IdsUrl, Config.options).subscribe(res => {
       callback(response);
   });

   getIds(res => {
        this.storeIds = {
          profileId: res.profile,
          refIds: res.refIds
        }
     }
   )

   // this.storeIds returns undefined as it's an async call
   this.http.post<any>(WebserviceUrl + this.storeIds.profileId , data, headers )

   // .....Many other web services that relay on this Ids
}

Upvotes: 0

Views: 62

Answers (2)

sandy
sandy

Reputation: 150

Just create another service called StoreIdsService. Update the response you get from your first api call 'getIds' in the StoreIdsService. The idea is to have StoreIdsService as singleton service to keep state of your storeIds. You can inject StoreIdsService in anywhere component you want to get the storeIds.

Its one of manyways to share data in angular between components.

Please refer to this answer someone has posted.

How do I share data between components in Angular 2?

Upvotes: 1

Nithya Rajan
Nithya Rajan

Reputation: 4884

You can simply assign the service response to the storeIds property inside the subscribe method. and call the subsequent services inside it if you need.

@Injectable ()
export class ContactService  {
   storeIds;

   getIds() {
   this.http.get<any>(IdsUrl, Config.options).subscribe(res => {
       this.storeIds = {
          profileId: response.profile,
          refIds: response.refIds
        }

      this.otherapicall1();
      this.otherapicall2();
   });

}

Upvotes: 0

Related Questions