javascript - RxJS groupBy 未获取订阅值

Question

我在 MongoDB 实例中有一个很长的列表，其中包含具有以下属性的 StockPrices:

• 时间戳
• 符号
• 价格

我想按符号对它们进行分组。我使用可观察来获取 StockPrices 列表并将它们注入(inject)到组件中，如下所示:

import {Component, OnInit} from '@angular/core';
import {ActivatedRoute} from '@angular/router';
import {StockPrice} from '../../model';
import {flatMap, groupBy, mergeMap, toArray} from 'rxjs/operators';
import {of, zip} from 'rxjs';

@Component({
    selector: 'compare-chart',
    templateUrl: './compare-chart.component.html',
    styleUrls: ['./compare-chart.component.scss']
})
export class CompareChartComponent implements OnInit {

    constructor(private route: ActivatedRoute) {
    }

    ngOnInit() {
        this.route.data.pipe(
            flatMap((data: { stockPrices: StockPrice[] }) => data.stockPrices),
            groupBy(stockPrice => stockPrice.symbol),
            mergeMap(group => zip(of(group.key), group.pipe(toArray())))
        ).subscribe(console.log);
    }

}

由于某种原因，控制台中没有发出和显示任何值，但我确实看到 StockPrices 列表是从服务器检索的。 我尝试了 rxjs.dev 中的所有提示和 learnrxjs.io .

有什么想法吗？

Answer 1

flatMap 期望返回一个可观察值，看来您想要的是这样做:

flatMap((data: { stockPrices: StockPrice[] }) => from(data.stockPrices)),

from 会将数组转换为可观察的流，flatMap 可以对其进行操作，以便 groupBy 可以完成它的工作。

值得注意的是，这并不是严格必要的，您可以只使用 Map 运算符和来自 lodash 或 soemthing 的同步 groupBy 工具。

groupBy 是一种复杂的运算符，只有当您想要对实际流进行分组时才需要它，例如您有来自网络套接字或轮询器等的实时股票价格流。