使用 http 客户端从服务器获取值并将其用于后续步骤

Question

我有一个如下所示的函数，我需要调用服务器并获取函数 returns 的值。我正在使用 rxjs 订阅。我得到了值，但由于 rxjs 在从服务器获取值之前是异步函数 returns 。下面是一个伪代码来解释我想做什么：

..

let myValue = getValue();
private getValue(): string {
 let val = '';
    this.httpClient.get('/server url', { observe: "response" }).subscribe(res => {
                val = res.headers.get('X-Some-Header-Name');
            });}
    return val;
}
..

我知道立即订阅 return，因此函数 getValue 不会 return 来自服务器的值。有没有一种方法可以使函数 return 仅在可观察 returns 时才具有价值？

Answer 1

如果您需要等待响应，那么您需要 return 一个可观察对象并在您需要值的地方订阅它。

let myValue = getValue();
private getValue(): Observable<string> {
    return this.httpClient.get('/server url', { observe: "response" }).pipe(
        map(res => res.headers.get('X-Some-Header-Name')),
    );
}

Answer 2

正如@satanTime 已经在中指出的那样，您应该使用 Observable 而 HttpClient returns.

然后您还可以使用 async pipe 在您的模板中使用 myValue，例如：

<p>{{myValue | async}}</p>

参考：https://angular.io/guide/observables-in-angular

使用 http 客户端从服务器获取值并将其用于后续步骤

Using http client to get a value from server and using it for next steps

javascript

rxjs

angular

rxjs-observables