angular - 如何在 RxJS 的 GroupBy 中使用分组键，

Question

我有 API 返回的结构

这是签名

methodApi(): Observable(Array<MyClass>)

这是数据

{ id: 1, name: 'Red', parentId: null }
{ id: 2, name: 'Apple', parentId: 1 }
others

我想按parentId分组

methodApi()
.pipe(groupby((x: MyClass[] => ...))) // THERE
.subscribe(x => console.log(x));

MethodApi 返回 Observable ，在“groupby”方法中作为输入参数我有数组，所以我不能引用 parentId 属性。当我将输入参数更改为 MyClass 时，出现编译错误。

如何解决这个分组？我将 Angular 9.0 与 RxJS 6.5.5 结合使用

Answer 1

您必须使用 from 从数组中创建另一个可观察流，然后使用 groupBy 并将其转换回结果数组:

methodApi().pipe(
  concatMap((result) => from(result)),
  groupBy((item) => item.parentId),
  mergeMap(group => group.pipe(toArray()))
).subscribe(x => console.log(x));

example stack

你也可以使用mergeAll:

methodApi().pipe(
  mergeAll(),
  groupBy((item) => item.parentId),
  mergeMap(group => group.pipe(toArray()))
).subscribe(x => console.log(x));

example stack