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() 。