Angular rxjs вызывает http-запросы пакетами с задержкой

У меня есть массив подписок:

const partsArray = parts.map(item => this.partsService.deletePart(item.id));

Затем я вызываю forkJoin для подписок и удаляю их все сразу:

  forkJoin(partsArray).subscribe({
    error: (error: ApiError) => {
      
    },
    complete: () => {
     
    }
  });

Проблема в том, что это может быть 10 или 100, поэтому мне нужно их группировать и делать задержку каждые 10.

10 API CALLS 
Delay of 500ms
10 API calls 
Delay of 500ms

Как я могу сделать это с помощью rxjs?

Проверьте этот ответ

BizzyBob 13.09.2022 13:48

Да, это ответ.

PokerJoker 13.09.2022 14:15
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
2
95
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

это может быть то, что вы ищете.

const partsArray = parts.map(item => this.partsService.deletePart(item.id).pipe(delay(500)));

forkJoin(partsArray).subscribe(...)

проверьте эту документацию о RxJs: https://www.learnrxjs.io/learn-rxjs/operators/utility/delay

ТАК задерживает каждый запрос, и я хочу отложить после каждого 10-го

PokerJoker 13.09.2022 13:53

взгляните на другие ответы, в которых используется bufferCount + Delay. Прочитайте документы для лучшего понимания

Nathan 14.09.2022 14:17
Ответ принят как подходящий

Если у вас есть миллионы частей, вы можете заранее разбить массив на части.


function chunk(arr, chunkSize) {
  if (chunkSize <= 0) throw "Invalid chunk size";
  let v = [];
  for (let i=0,len=arr.length; i<len; i+=chunkSize) {
    v.push(arr.slice(i,i+chunkSize));
  }
  return v;
}

const delayObs = timer(500).pipe(ignoreElements());

// An array of observables
const partsArray = parts.map(item => this.partsService.deletePart(item.id));

const partsChunked = chunk(partsArray, 10);

const apiResultsChunked = from(partsChunked).pipe(
  concatMap(parts => concat(forkJoin(parts), delayObs))
);

apiResultsChunked.subscribe({
  next: console.info,
  error: (error: ApiError) => {
    
  },
  complete: () => {
   
  }
});

Вы можете немного упростить это, если будете использовать буфер RxJS вместо предварительного разделения массива.

from(
  parts.map(item => this.partsService.deletePart(item.id))
).pipe(

  bufferCount(10),
  concatMap(parts => concat(
    forkJoin(parts), 
    timer(500).pipe(ignoreElements())
  ))

).subscribe({
  next: console.info,
  error: (error: ApiError) => {},
  complete: () => {}
});

Именно так

from(parts).pipe(
  map(({ id }) => this.partsService.deletePart(id)),
  bufferCount(10),
  concatMap((apis) => forkJoin(apis).pipe(delay(500)))
).subscribe(...);

Другие вопросы по теме