Angular 8：無需訂閱可觀察對象即可獲取值

Question

這是我需要在應用程序的各個部分訂閱的兩種方法：

  getProducts(): Observable<Product[]> {
    return this.http.get<Product[]>(this.url);
}

  getProductsByIds(ids: number[]): Observable<Products[]> {
    return this.getProducts()
      .map(products => products.filter(products => ids.includes(product.id)));
}

這適用於我的大多數組件，但在一個組件中，我事先知道id -s 並且只想顯示 id-s getProductsByIds([1, 2, 9, 18]) 4 個產品。我想像這樣調用方法： getProductsByIds([1, 2, 9, 18]) )。 我只知道如何訂閱這兩個 observable，但是我如何才能一勞永逸地獲得這 4 個產品（不需要值流）？ 我一定錯過了一些基本的講座..

Answer 1

您可以在service構造函數中調用該函數，並在獲得結果后將該結果設置為class級別變量staticProducts: Products[] 。

每當你想使用staticProducts ，注入服務並直接通過this.demoService.staticProducts

服務

@Injectable()
export class DemoService {

  staticProducts: Products[];

  constructor(.....) {
    // get static data on startup
    this.getProductsByIds([1, 2, 9, 18]);
  }

  getProductsByIds(ids: number[]): Observable<Products[]> {
    return this.getProducts()
      .map(products => products.filter(products => ids.includes(product.id)))
      .subscribe(res => {
        this.staticProducts = res;
      });
  }

  ...
}

Answer 2

如果您只想獲取一些值並將它們粘貼到沒有 Observable 的變量中。 從您的組件中，您可以像這樣調用 getProductByIds：

service.getProductByIds([1,2,9.8]).take(1).subscribe(x => {
   this.variableWithProducts = x;
});