首页 > 解决方案 > RXJS 如何延迟每个 observable(http 请求)并合并所有请求输出

问题描述

我在一个 observable 中设置 http 请求之间的间隔时遇到问题。事情是 - 我想在每个 http 请求之间有延迟,等待所有请求完成,并对来自所有请求的组合数据执行操作。当然文档数组的长度是未知的。

示例代码:

const documents = [
  {
    'documentId': 1,
    'documentName': 'DocName1'
  },
  {
    'documentId': 2,
    'documentName': 'DocName2'
  },
];

function saveDocumentService(document) {
  document['someAnotherData'] = '123';

  return of(document); // in real world http.post()
}

const documentsToSave$ = zip(
  documents,
  interval(200),
  document => {
    document['someDataToBeInserted'] = {'data': 123};
    return saveDocumentService(document);
  }
);

const sub = forkJoin(documentsToSave$).subscribe(documents => {
  console.log('All documents uploaded', documents); // array of responses
});

使用这种方法,仅输出最后一个值。

谢谢。

标签: angularrxjsobservablerxjs6

解决方案


您可以使用merge计时器并忽略所述计时器的输出:

import { of, from, timer } from 'rxjs'
import { concatMap, merge, ignoreElements, tap, toArray } from 'rxjs/operators'

const documents = [
  {
    'documentId': 1,
    'documentName': 'DocName1'
  },
  {
    'documentId': 2,
    'documentName': 'DocName2'
  },
];

function saveDocumentService(document) {
  document['someAnotherData'] = '123';
  return of(document)
}
from(documents)
  .pipe(
    concatMap(url => saveDocumentService(url).pipe(
      tap(res => console.log('Saved document...')),
      merge(timer(1000).pipe(ignoreElements()))
    )),
    toArray(),
  )
  .subscribe(documents => {
    console.log('Sub:', documents)
  })

堆栈闪电战


推荐阅读