如何返回包含/依赖于 Observable<B> 类型的 Observable 的 Observable<A> 类型的 Observable？答案

【问题标题】：How do you return an Observable of type Observable<A> which contains/relies-on an Observable of type Observable<B> ?如何返回包含/依赖于 Observable<B> 类型的 Observable 的 Observable<A> 类型的 Observable？
【发布时间】：2018-06-03 18:11:32
【问题描述】：

我正在HttpInterceptor 函数中编写一些代码。函数 intercept 应该返回一个类型为 HttpEvent<any> 的 Observable。

对我来说棘手的部分是我需要在此函数中进行异步调用，并且只有在我进入异步代码的“成功”函数时才能返回 Observable<HttpEvent<any>>。

所以我的问题是，我如何返回一个真正包含另一个不同类型的 Observable 的正确类型的 Observable？

这是我的代码

@Injectable()
export class MyInterceptor implements HttpInterceptor {

    constructor(private valueService: ValueService){}

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        const duplicate = req.clone({
            params: req.params.set('newVal', this.valueService.getNewValue())  // this.valueService.getNewValue() returns an Observable<string> !!
        });

        return next.handle(duplicate);
  }
}

【问题讨论】：

您可以使用flatMap。检查此链接：reactivex.io/documentation/operators/flatmap.html

标签： angular rxjs observable angular-http-interceptors

【解决方案1】：

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return this.valueService.getNewValue().
      switchMap((data:string)=>{  //or flatMap
         //You get "data"
         const duplicate = req.clone({
         params: req.params.set('newVal', data);
         return next.handle(duplicate);
       });
}

【讨论】：

那么Typescript明白最终返回的东西的返回类型与函数的返回类型匹配吗？这究竟是如何工作的？
你收到了一个req，你必须返回一个next.hanlde(req)。但是您创建了一个 Observable，并且使用 switchMap，不返回 observable，您使用来自 observable 的数据创建一个新请求并返回新请求的 next.hadle