Angular 8 Resolver - Как получить данные от одного распознавателя в качестве входных данных для другого распознавателя? - PullRequest
0 голосов
/ 12 апреля 2020

У меня 2 REST API. Данные из обоих API обязательны. В то же время 2-й API принимает в качестве параметра входные данные из API 1.

GET api / one -> {id: 3}, этот идентификатор ответа требуется в GET api / two? InputFromApiOne = 3 -> {name: 'SS'}

Мой окончательный ответ, доступный в компоненте, должен быть -

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

Я использовал преобразователь для получения данных из API One, но невозможно использовать это как входные данные во втором преобразователе.

Я также попытался получить данные из обоих API в resolver1. Я использовал flatMap, но в итоге получаю данные только из второго API.

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

Ответы [ 2 ]

0 голосов
/ 12 апреля 2020

Мне удалось добиться этого только с помощью await asyn c.

@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 };
 }
}

А затем в моем компоненте я просто взял данные из снимка маршрута.

this.dataFromBothApi = this.route.snapshot.data.myData
0 голосов
/ 12 апреля 2020

Я надеюсь, что вы указали оба резольвера в конфигурации вашего маршрута, например

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

И затем в вашем компоненте

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