CODEWITHSUNDEEP
angularangular-routingangular-resolver
Shubhashish Shukla
Shubhashish Shukla

Reputation: 111

Angular 8 Resolver - How to get data from one resolver as an input to other resolver?

I have 2 REST API. Data from both API is required. At the same time 2nd API takes input from API 1 as a parameter.

GET api/one --> {id: 3}, this response id is required in GET api/two?inputFromApiOne=3 --> {name: 'SS'}

My final response available in component should be -

{
  "id": 3, -- from API One
  "name": "SS" -- from API Two
}

I have used a resolver to get data from API One but unable to use that as an input in 2nd resolver.

I have also tried getting data from both API within resolver1. I have used flatMap but then I am ending up with data from 2nd API only.

resolve(route: ActivatedRouteSnapshot) {
  return this.myService.getDataFromApiOne(route.params.id).pipe(flatMap(data => {
    return this.myService.getDataFromApiTwo(data.someKey.id);
  }));
}

Upvotes: 3

Views: 8466

Answers (2)

Shubhashish Shukla
Shubhashish Shukla

Reputation: 111

I was able to achieve this only via await async.

@Injectable()
export class MyResolverService implements Resolve<any> {

 constructor(private myService: MyService) { }

 async resolve(route: ActivatedRouteSnapshot) {
   const dataFromApiOne = await 
   this.myService.getMediumDetails(route.params.id).toPromise();
   const dataFromApiTwo = await this.myService.getPageConfig(dataFromApiOne.id).toPromise();
   return { dataFromApiOne, dataFromApiTwo };
 }
}

And then in my component, I just grabbed the data from route snapshot.

this.dataFromBothApi = this.route.snapshot.data.myData

Upvotes: 1

Kiran Shinde
Kiran Shinde

Reputation: 5982

I hope you have specified both resolver in your route configuration like

 {
    path: '', 
    component: MyComponent,
    resolve: {
      fromResolverOne: Resolver1
      fromResolverTwo: Resolver2
   }
}

And then In your component

const resolverOneData = this.route.snapshot.data['fromResolverOne'];
const resolverTwoData = this.route.snapshot.data['fromResolverTwo'];

Upvotes: 2

Related Questions