RxJS 用另一个 Observable 中的值过滤一个 observable

Question

我正在寻找最好的 RxJs 方法来过滤 Observable 中保存的值。

首先，我有一个包含来自路由 Params 的自动收报机的可观察对象。假设它是 ticker$

中的“BTC”

然后我有一个可观察的商店，returns 我在 fullCoinList$

中有一个硬币列表（其中 1414 个）

我希望 this.coin$ observable 仅包含 this.fullCoinList$ observable 中的项目，其中包含代码名称某处的字符串“BTC”。

FullCoinList$ 看起来像这样。

  [{ticker: "ETHBTC", price: "0.04597600"}
   {ticker: "LTCBTC", price: "0.00457100"}
   {ticker: "BNBBTC", price: "0.01008450"}
   {ticker: "NEOBTC", price: "0.00163300"}
   {ticker: "QTUMETH", price: "0.00541200"}
   {ticker: "EOSETH", price: "0.00229400
   .... + 1408more]

我的 NgOnInit 看起来像这样

ngOnInit(): void {
    this.activatedRoute.paramMap.subscribe( (params: ParamMap) => {
      this.ticker$ = of(params.get('ticker'))
    })

    this.fullCoinList$ = this.store.pipe(select(selectAllCoins))
    
    this.coins$ = this.fullCoinList$.pipe(
      filter( coin => coin.ticker.includes(this.ticker$)) // this line needs work
    )
  }

这是 mergeMap、concatMap 或类似东西的好用例吗？我将如何最好地实施它？我也不确定 includes 是否是正确的方法。

编辑：我添加了一个 stackBlitz Blitz

Answer 1

我会使用 combineLatest 将两个可观察值结合起来，然后从那里开始。

import { combineLatest } from 'rxjs';
import { map } from 'rxjs/operators';
...
ngOnInit(): void {
    // we can get rid of a subscription here and assign it to the observable directly
    this.ticker$ = this.activatedRoute.paramMap.pipe(
      map(paramMap => paramMap.get('ticker')),
    );

    this.fullCoinList$ = this.store.pipe(select(selectAllCoins))
    
    this.coins$ = combineLatest(this.fullCoinList$, this.ticker$).pipe(
      // the filter is the array filter and not rxjs filter
      map(([fullCoinList, ticker]) => fullCoinList.filter(fullCoin => fullCoin.ticker.includes(ticker))),
    );
  }

类似的东西应该有用。

RxJS 用另一个 Observable 中的值过滤一个 observable

RxJS filter an observable with value in another Observable

rxjs

ngrx

angular