Angular2鏈http請求

Question

我必須提出2個http請求。 第一個http請求，用於返回url和一些字符串的列表。 然后，我需要在此url上發出另一個http請求以獲取其他數據，並將該數據附加從第一個http請求獲得的字符串。

我應該如何在angularJs2中執行此操作

現在，我可以使用observable來發出第一個http請求，但是我仍然無法獲得第二個http請求。

我一直在觀察observable，flatmap和mergemap，但是我對angular2和observable都是陌生的，這有點令人困惑。

所以我的問題是鏈接這兩個請求的最佳方法是什么？

Answer 1

這個答案不是特定於Angular的，而是主要展示了如何將Reactive運算符鏈接在一起以獲得所需的東西。 您可以執行以下操作（警告：未經測試的代碼）：

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switch';

export class Foo {
    bar() {
        const httpClient: HttpClient = /* Your HTTP client here */;
        httpClient
            .get<UrlAndString[]>('first url')
            .map(urlsAndStrings => {
                const parameter = doSomethingWithUrlsAndStrings(urlsAndStrings);
                return httpClient
                    .get<SecondResult>(`second url?param=${parameter}`)
                    .map(secondResult => { return [urlsAndStrings, secondResult]; });
            })
            .switch()
            .subscribe(tuple => {
                console.log(tuple[0]); // The urls and strings, of type UrlAndString[].
                console.log(tuple[1]); // The second result, of type SecondResult.
            });
    }
}

import語句引入了map和switch運算符，以便您可以鏈接它們。

map通過事件來轉換事件，因此您可以看到，當第一個.get()返回某些內容時，它將被映射到另一個Observable<T> 。 因此，第一個map函數的類型簽名將為map<UrlAndString[], Observable<[UrlAndString[], SecondResult]>> 。 這意味着它將返回Observable<Observable<[UrlAndString[], SecondResult]>>或發布Observable的Observable ，后者發布了類型為UrlAndString[]和SecondResult元組。

switch接受一個Observable<Observable<T>>並將其轉換為Observable<T> 。 我上面鏈接的文檔比我能更好地解釋它。 但是您可以看到該.switch()的返回類型將是Observable<[UrlAndString[], SecondResult]> 。

您可能已經熟悉的.subscribe() 。