如何在 rxjs 中創建可觀察的瀑布？

Question

我確信可觀察到的瀑布不是一件事，但它最好地描述了我想要做的事情。

代碼

給定的是代表其內容的路徑和行為對象的映射。

const pathmap = new Map<string, BehaviorSubject<string>>();
pathmap.set("foo.txt", new BehaviorSubject<string>("file is empty"));
pathmap.set("bar.txt", new BehaviorSubject<string>("file is empty"));

還給出了一個包含活動路徑的 BehaviourSubject。

const activePath = new BehaviorSubject<string | null>(null);
...
activePath.next('bar.txt');

我需要的：

我想創建一個在以下情況下觸發事件的單鏈 Observable：

A) 活動文件路徑已更改。

B）文件的內容發生了變化。

到目前為止我所擁有的：

https://codesandbox.io/s/bold-dream-3hfjdy?file=/src/index.ts

function getFileContentObservable(): Observable<string> {
  return currentFile.asObservable()
    .pipe(map((path: string) => pathmap.get(path).asObservable()))
    .pipe(map((content: string) => `<h1>${content}</h1>`));
          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
          Type 'string' is not assignable to type 'Observable<string>'
}

我將如何鏈接這個？

Answer 1

嘗試switchMap運算符。

function getFileContentObservable(): Observable<string> {
  return currentFile.asObservable().pipe(
    filter(Boolean),
    switchMap((path: string) => pathmap.get(path).asObservable()),
    map((content: string) => `<h1>${content}</h1>`)
  );
}