时间戳

首页 > 解决方案 > flatMap 不能按预期的调用链工作

angular - flatMap 不能按预期的调用链工作

问题描述

使用带有打字稿的 rxjs 可观察对象来组织调用链的问题

我是 RXJS 的新手，在我的打字稿代码中组织调用链时遇到了一些麻烦。问题是 - 如何制作 this.http.get(' http://www.gooogle.com '); 只调用一次。此代码不是真实的，只是重现的最小情况

import {Injectable} from '@angular/core';
import {flatMap, map} from 'rxjs/operators';
import {Observable, from} from 'rxjs';
import {HttpClient} from '@angular/common/http';

@Injectable()
export class CoolService {

  constructor(private http: HttpClient) {}
  x(): Observable<Object> {
    return from(Promise.resolve({a: {b: 'c'}})).pipe(
      flatMap((x) => {
        console.log(x);
        return this.http.get('http://www.gooogle.com');
      }), map((res) => {
        console.log(res);
        return res;
      }));
  }
}

标签： angulartypescriptrxjsflatmap

解决方案

原因是我不了解 rxjs 运算符的工作原理。所有运营商都在为每个订阅做工作，但我认为它正在为所有订阅做一个计算。因此，我在服务中进行了一系列调用并在不同的地方订阅响应 - 作为一个原因，操作员在代码中运行的次数与订阅一样多，所以我需要重建它

推荐阅读