Angular предварительно заполнить данные для нескольких полей с помощью Resolver, распознаватель вернет наблюдаемый внутри подписчика - PullRequest
Новая
       76

Angular предварительно заполнить данные для нескольких полей с помощью Resolver, распознаватель вернет наблюдаемый внутри подписчика

0 голосов
/ 22 февраля 2020

В моем Angular (8) приложении нужно предварительно заполнить пару полей из сервиса (БД). вариант использования: требуется предварительно заполнить Address, Apartrment et c из БД против соответствующего PIN-кода / почтового индекса. и получить этот почтовый индекс из другой службы

Я пытался использовать Resolver

Маршрутизатор: 

const routes: Routes = [
{
  path: 'my-form',
  component: MyFormComponent,
  resolve: { managers: ManagerResolver, locationTrack: LocationTrackResolver,savedAddress: AddressResolver}
},

в моем компоненте 

this.managers= this.route.snapshot.data.managers;
    this.locationTrack = this.route.snapshot.data.locationTrack;
 this.savedAddress = this.route.snapshot.data.savedAddress;

И адрес Resolver: здесь один подписчик для получения пин-кода на основе местоположения и внутри подписчика другой Наблюдаемый для получения данные. 

@Injectable()
export class AddressResolver implements Resolve<Observable<PatientAddress>> {

   savedAddress: Observable<PatientAddress>;

  constructor(private addressService: AddressService, private locationMapService: LocationMapService) { }
  resolve(route: ActivatedRouteSnapshot): Observable<PatientAddress> {

    this.locationMapService.getLocation().subscribe(location => {

      this.savedAddress = this.addressService.getLastSavedAddressByPinCode(location.postal);
    });
    return this.savedAddress;
  }
}

1 Ответ

2 голосов
/ 22 февраля 2020

Observable является асинхронным, поэтому возвращение this.savedAddress за пределами подписки будет неопределенным, используйте switchMap, чтобы возвратить внутреннюю наблюдаемую, как это

Попробуйте это: 

   @Injectable()
    export class AddressResolver implements Resolve<Observable<PatientAddress>> {

      savedAddress: Observable<PatientAddress>;

      constructor(private addressService: AddressService, private locationMapService: LocationMapService) { }

      resolve(route: ActivatedRouteSnapshot): Observable<PatientAddress> {
       this.savedAddress = this.locationMapService.getLocation().pipe(switchMap(location => 
       this.addressService.getLastSavedAddressByPinCode(location.postal)));
       return this.savedAddress;
   }
 }
...