解决Angular HTTP + RxJS对接API的两个问题
嘿,我来帮你搞定这两个需求!
一、将Observable<List>转换为Observable的RxJS操作符
你需要的是**mergeAll()**(或者它的别名flatMap()/mergeMap(),直接用mergeAll()更简洁),另外concatAll()也能实现类似效果,具体看你的场景:
用法示例:
假设你的服务返回Observable<X[]>,想要把它转换成逐个发出X元素的Observable<X>,可以这么写:
import { mergeAll } from 'rxjs/operators';
// 假设yourService.getList()返回Observable<X[]>
this.yourService.getList().pipe(
mergeAll()
).subscribe(item => {
// 这里每次会收到单个X类型的对象
});
或者用mergeMap(和flatMap是同一个操作符),效果完全一致:
import { mergeMap } from 'rxjs/operators';
this.yourService.getList().pipe(
mergeMap(items => items) // 把数组当成可迭代数据源展开
).subscribe(item => {
// 处理单个元素
});
mergeAll():会同步地把数组里的所有元素依次发出,适合大多数场景;concatAll():和mergeAll()类似,但如果是异步数据源会严格按顺序处理,不过对于同步数组来说两者没区别;- 如果需要在展开前对数组做过滤/转换,也可以先加
map操作符处理数组,再用mergeAll。
二、处理不友好的API返回结构,返回Observable<List