Angular rxjs concat 操作符连接类型不同的数据流

Question

问题产生:

列表关系: 项目(列表1)>工作簿(列表2)
在列表2中,需要从多个接口取回数据,合并一起后,展示.使用`concat`操作符,如下操作,输出结果,只有`this.projectsTem`的数据.
`this.projectsTem`已经正常拿到数据.

问题关键点:`两个流的类型不一样,该如何处理?` 分别是`Observable<WorkBook>`,`Observable<Project[]>`

workbooks: Observable<WorkBook>;
projectsTem: Observable<Project[]>;
... ...
this.workbooks = this.dataServe.getWorkbooks(this.projectId).pipe(concat(this.projectsTem))

列表1:

点击Data展示列表:2

Answer 1

使用mergeMap或者mergeMapTo合并流。

const workbooks$ = of('hello'); // 字符串
const projectsTem$ = of(['world', 'girl']); // 数组

const test = workbooks$.pipe(
    mergeMapTo(projectsTem$, (x, y) => {
      return x + '' + y[1];
    })
  );

test.subscribe(val => console.log(val));
// -> hello girl