如何使用ngrx observables避免回调地狱

Question

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

以下是订阅 observable 的代码 sn-p。

商店

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));
  }
}

如何避免上述回调。在 Promise 世界中，我们可以轻松地链式 Promise。由于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));    
});

您可以将这些不同的运算符视为您的Promisethen()s，但它们更强大，因为它们可以做更多事情。