RXJS 如何在另一個中使用一個可觀察的結果（然后將這兩個結果一起處理）

Question

使用 RxJs 時的一個非常常見的問題似乎是希望一個或多個 observables 的結果然后在后續的那些中使用它們。

例如在偽代碼中（這不是 rx 或故意的有效 js 語法）

var someResult = $observable-A; // wait to complete
var finalResult = $observable-B(someResult.aValueINeed);

這可以通過一種丑陋的方式來完成，您可以同時訂閱兩者並在另一個內部調用一個。但是，這非常混亂並且不能為您提供很大的靈活性。

例如（真正的語法）

$observable-A.subscribe(resultA => { 
    $observable-B(resultA.aValueINeed)
        .subscribe(resultB => { 
            console.log('After everything completes: ', resultB); 
        }
}

這也意味着當您完成這兩個可觀察項時，沒有其他東西可以輕易地消耗這個 stream。

我的具體用例需要以下內容：

1. 獲取 $observable-A 的初始調用，因為它不需要任何其他內容（這是一個基本的 http GET 調用）
2. 對另一個服務的 http GET 調用需要來自 $observable-A 的數據，該服務返回 $observable-B
3. 使用兩個可觀察結果 (A + B) 為我的服務創建一個 object（在我的例子中，一個 Angular 服務）返回一個列表。

我還需要能夠在我的服務中訂閱這個 function，這就是為什么使用上面的訂閱方法對我不起作用的原因。

Answer 1

Snorre Danielsen 解決了這個問題，這個解決方案的全部功勞歸於他。 我建議看看這個。

rxjs 運算符的優點在於它們的互操作性。 您可以混合搭配幾乎所有東西以獲得您想要的結果。

簡而言之。 這個問題的代碼答案如下，我會進一步解釋。

$observable-A.pipe(
    mergeMap(resultA => {
        return combineLatest(
            of(resultA),
            $observable-B(resultA)
        )
    }),
    map(([resultA, resultB]) => {
        // you can do anything with both results here
        // we can also subscribe to this any number of times because we are doing all the processing with
        // pipes and not completing the observable
    }
)

mergeMap （或flatMap是別名）將 observable 作為輸入並將其投影（就像常規的 map 函數一樣）。 這意味着我們可以使用它的結果作為$observable-B的輸入。 現在，當您實際上只想返回第二個可觀察結果時，這非常有用。 例如

$observable-A.pipe(
    mergeMap(resultA => $observable-B(resultA)),
    map((resultB) => {
        // resultA doesn't exist here and we can only manipulate resultB
    }
)

現在，回到主要解決方案。 combineLatest是這里的關鍵。 它允許mergeMap基本上“等待”內部可觀察對象（ $observable-B ）完成。 沒有它，您只會在pipe中向您的下一個 rxjs 運算符返回一個可觀察值，這不是我們想要的（因為您期望在pipe中處理常規運算符函數）。

正因為如此，我們可以將這些新合並的 observables 帶入鏈的下一部分，並一起使用它們。 我們使用of() function 重新創建resultA ，因為combineLatest僅將 observables 作為輸入，而resultA是 state 中的完整 observable。

提示：看一下map(([resultA, resultB]) 。我們使用這個符號來引用我們的變量而不是標准map(results)的原因是這樣我們可以直接引用它們而不使用results[0]用於resultA或results[1]用於resultB 。這樣閱讀起來要容易得多。

我希望這對人們有所幫助，因為我還沒有找到涵蓋此案例的完整 SO 答案。 編輯非常受歡迎，因為它很復雜，我相信它不是一個完美的答案。