嵌套服务中的 Angular 嵌套可观察对象 - 如何

Question

我知道如何在同一组件/服务中执行嵌套的 observable。或者如何将可观察对象从服务返回到组件。但是我如何从一个可观察服务获取数据到我的组件中，该服务从另一个可观察服务获取数据:

一个简化的场景:

我有一个通过 observable 返回我的数据的 APIService:

export class StockAPIService {
// ...
    getProducts(): Observable<any> {     
        return this.http.get<any>(this.productsUrl);
    }
}

我通常会在组件中像下面这样使用它:

export class ProductsComponent {
    products = {};
    ngOninit() {
        stockApiService.getProduct().subscribe(products => 
              this.products = doCalcWithProducts(products))
    }

    doCalcWithProducts() {
       // ALLOT of business logic comes here that I want to move to a service
    }
}

所以我想做一个看起来像这样的服务:

export class ProductService {
    doCalcWithProducts(): observable<any> {
        return stockApiService.getProduct().subscribe(products => 
              return doMoreCalcWithproducts(products))
    }
}

然后我的组件实际上只是看起来像这样:

export class ProductsComponent {
    products = {};
    ngOninit() {
        this.ProductService.doCalcWithProducts().subscribe(products => 
              this.products = products)
    }
}

...删除了业务逻辑，但仍将我的 APIService 与我的 ProductService 分开

但是我在 ProductService subscribe 中收到错误消息Type 'Subscription' is not assignable to type 'Observable'.

我已经尝试了从管道到映射的所有方法，而不是订阅...

Answer 1

ProductService 必须返回一个 Observable。这意味着您不能在 doCalcWithProducts() 方法内进行订阅。

您应该将 stockApiService.getProduct() 结果通过 map 函数进行管道传输。像这样:

export class ProductService {
  doCalcWithProducts(): Observable<any> {
    return stockApiService.getProduct().pipe(
      map(products => this.doMoreCalcWithproducts(products))
    );
  }
}