【问题标题】:Calling observables synchronously one after another in Angular在Angular中一个接一个地同步调用observable
【发布时间】:2018-06-26 17:44:15
【问题描述】:

我有以下可用的服务电话:
productService.GetAllProducts()
productService.DeleteProduct()
productService.GetCategories()
productService.DeleteCategory()

在 sudo 代码中,我需要在我的组件中执行以下操作:

  1. 使用 productService.GetAllProducts() 获取产品列表。

  2. 遍历产品列表并为每个产品调用 productService.DeleteProduct()。

  3. 一旦我可以确认上述删除全部完成(由于 db 限制),我需要使用 productService.GetCategories() 获取类别列表。遍历每个类别并调用 productService.DeleteCategory()。

我知道,如果我有更好的后端调用来进行批量删除,我的生活会轻松很多,但在这种情况下我别无选择。我需要遵循获取列表的模式,循环遍历它,每个项目单独删除一个。

是否有可能使用 flatMap 和 observable complete 参数做我想做的事情?我最大的问题是在搜索和删除所有类别之前知道代码何时完成删除所有产品。

【问题讨论】:

  • 您已经问过同样的问题:stackoverflow.com/questions/51047390/…。你得到了答案和几个链接。
  • 那篇文章中的链接不能解决我的问题。您实际上是在阅读我正在尝试做的事情,还是只是根据标题立即将内容标记为重复?我意识到我的问题与您链接的帖子略有不同,因此创建了一个新帖子。
  • 他们确实解决了您的问题。但是 observables 很难,你需要仔细阅读文章,如果需要可以多次阅读,并在简单地拒绝解决方案之前进行实验。如果文章/建议中有您不理解的内容,请要求澄清,而不是重新发布相同的问题。
  • 知道了,我会更彻底地阅读它们。无论如何,您可以给我一个大致的想法,看看我上面的 4 个 sudo 代码步骤,每个部分我需要哪些功能?
  • 使用 forkJoin 从需要并行执行的几个 observable 中创建一个 observable(即多次删除)。使用 switchMap 一个接一个地执行 observable。

标签: angular typescript rxjs


【解决方案1】:

你可能想尝试这些方面的东西

productService.GetAllProducts()
.switchMap(
   products => forkJoin(products.map(product => productService.DeleteProduct(product)))
)
.switchMap(() => productService.GetCategories())
.switchMap(
   categories => forkJoin(categories.map(category => productService.DeleteCategory(category)))
)
.subscribe(() => console.log('done'))

整个思路如下

  • GetAllProducts 返回一个 Products 数组,作为 参数到第一个switchMap
  • Products 数组通过map 转换为一个数组 作为 DeleteProduct 的结果的 Observables - 的数组 Observable 作为参数传递给第一个forkJoin
  • forkJoin 在它收到的所有 Observables 时发出 参数完成,因此将在所有产品时发出 已被删除
  • 对于类别重复相同的推理

我不确定代码在语法上是否完美,但应该足以让您了解如何进行。

【讨论】:

  • 感谢您的出色回答。实际上,我最终以类似的方式解决了它,仍然使用 forkJoin 和 map 进行删除,因此它们并行发生,但是将每个 delete observables 设置为一个变量,然后使用 concat 并订阅它。有点像这样...订阅 GetAllProducts 然后在其中创建一个执行 forkJoin 和映射的 const deleteProducts。然后订阅 GetCategories,然后在其中创建一个执行 forkJoin 和映射的 const deleteCategories。然后最后 const deletes = concat(deleteProducts, deleteCategories).subscribe().
  • 如果您觉得 switchMap 技术因某种原因更好,请告诉我。
  • 我不确定我是否理解逻辑,但乍一看,我质疑您如何确定 deletes = concat(deleteProducts, deleteCategories).subscribe()deleteProductsdeleteCategories 运行实际上是指向结果的变量2 forkJoin,他们还不是undefined。我建议的方法是一系列运算符将第一个“源”Observable 逐步转换为其他 Observable,直到您获得最后一个订阅以完成工作。一般来说,我倾向于认为subscribe越少越好。
  • 通过我建议的链,您始终知道自己在做什么,并且不知何故,您能够重新控制异步事件流,例如您所描述的那些。
猜你喜欢
  • 1970-01-01
  • 2018-08-04
  • 2018-08-25
  • 1970-01-01
  • 2018-09-16
  • 1970-01-01
  • 1970-01-01
  • 2020-09-17
  • 1970-01-01
相关资源
最近更新 更多