Question

我需要从redux store获取数据以进行另一个api调用，并且响应需要保存到商店。在这种情况下，我们如何避免callback地狱。

以下是订阅observable的代码片段。

商店

this.user$ = this.store.select('user');
this.dataStore$ = this.store.select('dataStore')

回调地狱

this.user$.subscribe((user: any) => {
  this.abcService.getData(user.id).subscribe((data:any) => {
    this.data = data;
    this.dataStore$.dispatch(abcAction(data));
  }
}

如何避免上述回调。在承诺世界，我们可以轻松地链接承诺。由于observables不可链接，我们如何避免嵌套回调以及编写上述代码的最佳方法。想知道如何应用最好的rxjs运算符。

非常感谢任何帮助。

Answer 1

您希望利用rxjs提供的许多运算符。例如，您可以按如下方式重写上述代码：

this.user$
.flatMap((user: any) => this.abcService.getData(user.id))
.subscribe((data: any) => {
    this.data = data;
    this.dataStore$.dispatch(abcAction(data));    
});

您可以将这些不同的运营商视为Promise then()，但功能更强大，因为他们可以做得更多。

如何避免与ngrx observables的回调地狱

1 个答案: