Блог

Главная - Вопросы по программированию - Угловой с Акитой и Rxjs, имеющими проблемы с foreach внутри внешнего наблюдаемого

Угловой с Акитой и Rxjs, имеющими проблемы с foreach внутри внешнего наблюдаемого

#rxjs #angular11 #angular-akita #akita

Вопрос:

Я новичок в Угловом с Акитой.

У меня есть приложение, в котором пользователи загружаются и устанавливаются в магазине. у всех пользователей начальное свойство ImageUrl имеет значение, например: ‘http://testxxxxxx» Компонент запрашивает хранилище для всех пользователей и по каналу вызывает метод, который проходит через каждого пользователя, выполняет вызов api, чтобы получить ответ на изображение «большого двоичного объекта» от api, и обновляет хранилище с помощью ImageUrl человека = «большой двоичный объект:http:2fk2fjadkf», и компонент устанавливает

Но по какой-то причине метод внутри внешнего наблюдаемого повторяется много раз. не знаю почему.

Вот мой код:

Компонент:

 peopleToShow$ = this.peopleFacade.peopleToShow$;

Component.html использует peopleToShow$ и свойство ImageUrl каждого человека. Прямо сейчас он не принимает обновленный URL-адрес большого двоичного объекта, заданный в блоках this.loadimagesas

Фасад:

   peopleToShow$ = this.peopleQuery.peopleToShow$
  .pipe(
    tap((people) => this.loadImagesAsBlobs(people))
  );

private loadImagesAsBlobs(people: Person[]) {
    people.forEach((person) => {
      if (!person.isUrlChecked) {
        this.imageDataService
          .getAndStoreImageOnClient(person.imageUrl)
          .pipe(
            take(1),
            switchMap((safeUrl) => {
              this.updatePersonWithBlobImageUrl(person.id, safeUrl);

              return EMPTY;
            }),
            catchError(() => {
              this.updatePersonWithBlobImageUrl(person.id, null);

              return EMPTY;
            })
          )
          .subscribe();
      }
    });
  }

  private updatePersonWithBlobImageUrl(id: number, blobUrl: SafeUrl) {
    this.peopleStore.updatePersonWithBlobImageUrl(id, blobUrl as string);
  }

Спасибо

Ответ №1:

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

Чтобы исправить, измените

 peopleToShow$ = this.peopleQuery.peopleToShow$
.pipe(
  tap((people) => this.loadImagesAsBlobs(people))
);

Для

 peopleToShow$ = this.peopleQuery.peopleToShow$
.pipe(
  tap((people) => this.loadImagesAsBlobs(people)),
  share()
);

или используйте shareReplay(1) вместо этого, если вы беспокоитесь о том, что люди будут показывать$, прежде чем все будет настроено ниже по течению.

Метки: ,