Angular RxJS 如何使用上游管道传递的时间参数实现延迟操作

delay是RxJS提供的管道操作符，只能作为pipe方法的参数传入管道链中，不能在map操作符的回调函数内直接调用。map仅支持同步转换数据流的值，无法处理异步延迟逻辑。

import { delay, concatMap, of, Observable } from 'rxjs';

getMessageInSomeTime(): Observable<string> {
    const someAsyncData = {
      text: 'Some text',
      dealyTime: 5000
    };
    return of(someAsyncData).pipe(
      concatMap(response => {
        // 基于上游返回的动态时长做延迟后返回对应文本
        return of(response.text).pipe(delay(response.dealyTime));
      })
    );
}

• 用concatMap高阶操作符替代原来的map，它可以把上游的每个值映射为新的Observable，并且会等待内部Observable完成后再向下游发射值，刚好满足延迟后返回数据的需求
• 在单值返回的场景下，你也可以根据业务需要用mergeMap或者switchMap替代concatMap，最终效果一致
• 你示例代码中的延迟字段拼写为dealyTime，如果是手误建议修正为标准的delayTime，避免后续维护出错

内容的提问来源于stack exchange，提问作者Sergey Kudryashov