使用来自一个 ngrx store reducer 的 Observable 数据来过滤另一个结果

Question

我的 ngrx 存储包含两组数据：preferenceGroups 包含一组选定的偏好值和stocks：

有很多preferenceGroups，有两种格式之一，一组布尔值或一个范围：

"preferenceGroups": [
    {
        "name": "Sectors",
        "type": "toggles",
        "preferences": [
            {
                "label": "Sector 1",
                "type": "boolean",
                "value": true
            },
            {
                "label": "Sector 2",
                "type": "boolean",
                "value": true
            }
        ]
    },
    {
        "name": "Exchange",
        "type": "toggles",
        "preferences": [
            {
                "label": "Exchange 1",
                "type": "boolean",
                "value": true
            },
            {
                "label": "Exchange 2",
                "type": "boolean",
                "value": true
            }
        ]
    },
    {
        "name": "Price",
        "type": "price-range",
        "preferences": {
            "label": "Price",
            "type": "currency",
            "value": {
                "minimum": 0,
                "maximum": 999
            }
        }
    },
    ...
]

我也有一堆股票，都是一样的字段，一般是这样的：

"stocks": [
    {
        "state": {
            "accepted": false,
            "rejected": false
        },
        "change": -5.36,
        "changePercent": -0.13,
        "dividend": 12.05,
        "equitySummaryScore": 8,
        "exchange": "Exchange 1",
        "price": 97.10,
        "sector": "Sector 1",
        ...
    },
    ...
]

我的过滤器的工作方式是针对每个偏好组，我想考虑任何具有与任何设置为 true 的布尔过滤器匹配的值的股票，在范围的情况下，任何在该范围内的值.

我可以使用 Observables 从我的ngrx 商店获取所有股票和preferenceGroups

this.stocks = this._store.select('stocks');
this.preferenceGroups = this._store.select('preferenceGroups');

我需要做的是通过使用this.preferenceGroups 中的数据过滤this.stocks 来将过滤后的股票存储为Observable。

this.filteredStocks = [something I can't figure out]

例如，我列出的单只股票将是匹配的，因为它有 "exchange": "Exchange 1"、"sector": "Sector 1" 和 "price": "97.10"

Answer 1

如果您有两个 observable，一个带有股票，另一个带有您的过滤器，您需要合并两个流。您需要的是每只股票的数组和您的偏好，以了解您是否可以展示它们。 检查以下代码：

let stocks$ = Rx.Observable.of(["stock1", "stock2", "stock3"]);

let preferences$ = Rx.Observable.of(["preference", "preference2"]);

let combined$ = Rx.Observable.combineLatest(
  stocks$, preferences$, (stocks, preferences) => {
      // implement your filtering logic here and returned the filtered stocks
      return stocks + " " + preferences
  });


combined$.subscribe((val) => console.log(val));

当使用 combineLatest 时，您可以组合两个 observable。传递给 combineLatest 方法的函数将获得来自stocks$ observable 的最新值和来自preferences$ observable 的最后一个值。这些 observables 来自您的商店。

在此函数中，您可以像在命令式样式中一样实现过滤逻辑。

每次将新股票添加到商店时，ngrx 都会向可观察的股票推送一个新值，并且将重新评估符合您逻辑的函数。新的偏好也是如此。

如果您在模板中订阅了组合 $ 流，则每次添加股票或添加偏好都会导致更新视图。