Как использовать объединение последних и объединение карт для нескольких подписок? - PullRequest
1 голос
/ 10 апреля 2020

Я все еще изучаю rx js и у меня проблемы с использованием нескольких подписок. Мне нужно получить идентификатор из ответа, чтобы добавить фотографии к продукту.

    create(product) {
     this.api.createProduct(product).subscribe(product => {
       product.photos.forEach(photo => {
         photo.productId = product.id;
         this.api.addPhoto(photo).subscribe();
      });
    });

Это мое рабочее решение, но я знаю, что оно неверно, и я должен использовать mergeMap и CombinLatest, но я не знаю, как.

Обновление 1

Мое решение

create(productForm) {
  this.api.createProduct(productForm).pipe(
    mergeMap(photo => {
      return combineLatest([
        productForm.photos.map(photo => {
          this.api.addPhoto({...photo, productId: product.id})//.subscribe()
          })
        ]);
   ).subscribe();
}

Я не могу добавить фотографии в текущее решение. Только когда я добавил подписку на addPhoto, это сработало.

Обновление 2

Мое решение

create(productForm) {
  this.api.createProduct(productForm).pipe(
    mergeMap(photo => {
      const photos = [];
      productForm.photos.map(photo => {
        photos.push(this.api.addPhoto({...photo, productId: product.id}));
      });
      return combineLatest([...photos]);
   })
  ).subscribe();
}

Теперь оно работает правильно.

1 Ответ

2 голосов
/ 10 апреля 2020

Попробуй построить одну трубу, которая делает все. Тогда, когда вам это нужно - просто подпишитесь один раз.

Также не ясно, почему в вашем forEach есть comment и photo, с ошибкой ли это?

В любом случае, ваша последовательность может выглядеть вот так:

const flow$ = this.api.createProduct(product).pipe(
  mergeMap(product => {
    const sequence = [];
    product.photos.forEach(photo =>
      sequence.push(this.api.addPhoto({...photo, productId: product.id)),
    );
    return forkJoin(...sequence); // <- once product has been created it adds its photos.
  }),
);

// then somewhere
flow$.subscribe(); // <- makes the whole pipe active.

или вы можете иметь Observable для фотографий и интегрировать его с потоком.

const addPhotos =(product) => product.photos.map(photo => api.addPhoto({...photo, productId: product.id));

cont flow$ = api.createProduct(product).pipe(
  map(addPhotos),
  mergeMap(o$ => forkJoin(...o$)),
);
...