在 forkjoin 中使用 NGXS 状态数据

Question

在 Angular 组件中，我必须从 API 检索数据，然后将其与 NGXS 状态变量中的一些状态数据一起使用。在我的组件中我有这个：

  @Select(MyObjectState.get)
  public readonly myobjects$: Observable<MyObject[]>;

我想做的是这样的：

    forkjoin([this.apiService.GetSomeData(), this.myobjects$])
    .pipe(
        map(([mydata, myobjects]) => {
            ...do some stuff
        })
    )
    .subscribe((result) => {
        ...more stuff
   })

问题是“forkjoin”永远不会完成并调用映射操作符。我不确定

myobjects$

Observable 是否未完成或什么，但它只是挂起。我通过将

myobjects$

替换为

of([])

进行了测试，然后“forkjoin”完成。

如何将状态数据与 API 数据结合起来？

Answer 1

forkJoin

仅在其所有源完成时才会发出。根据您希望执行订阅逻辑的时间，您有几种选择。

仅执行一次

forkjoin([
  this.apiService.GetSomeData(),
  this.myobjects$.pipe(take(1)), // <--- take(1) 
]).pipe(
  /* ... */
).subscribe(
  result => { /* ... */ }
);

您可以使用

take

运算符使您的可观察对象在一次发射后完成，从而允许

forkJoin

发射结果。

对每个源排放执行

combineLatest([this.apiService.GetSomeData(), this.myobjects$]).pipe(
  /* ... */
).subscribe(
  result => { /* ... */ }
);

如果您想在每次任何源发出时运行订阅逻辑，您可以使用

combineLatest

。这不需要源完成，只需要每个源至少发出一个值。

获取数据，然后在

myObjects$

发出时执行

this.apiService.GetSomeData().pipe(
  switchMap(mydata => this.myobjects$.pipe(
    map(myobjects => /* ... */
  ))
).subscribe(
  result => { /* ... */ }
);

您还可以使用

switchMap

。上面的代码从 api 服务调用中获取排放量，然后将它们映射到新的可观察量。来自这个“内部可观察”的排放将会被排放。

您可以使用嵌套的

.pipe()

，以便您的内部逻辑可以访问

mydata

发射以及

myobjects

发射。