NGRX加载指示器,带“标记”;嵌套的;API请求
我正在从API加载产品的评论,并将其存储在状态中。有一篇评论是这样的:NGRX加载指示器,带“标记”;嵌套的;API请求,api,asynchronous,redux,ngrx,effects,Api,Asynchronous,Redux,Ngrx,Effects,我正在从API加载产品的评论,并将其存储在状态中。有一篇评论是这样的: // Review { _id: 'reviewId', productId: 'productId', creatorId: 'userId', writerId: 'userId', content: 'review content', rating: 4.5, } 但是我还需要关于产品、创建者和作者的信息。因此,我有类似于LoadManyByIds(针对用户和产品)的操
// Review
{
_id: 'reviewId',
productId: 'productId',
creatorId: 'userId',
writerId: 'userId',
content: 'review content',
rating: 4.5,
}
但是我还需要关于产品
、创建者
和作者
的信息。因此,我有类似于LoadManyByIds
(针对用户和产品)的操作
加载所有内容后,状态可能如下所示:
// State
{
reviewEntities: {
reviewId1: {
_id: 'reviewId1',
productId: 'productId',
creatorId: 'userId',
writerId: 'userId',
content: 'review content',
rating: 4.5,
},
reviewId2: {},
reviewId3: {},
//...
},
userEntities: {
userId1: {},
userId2: {},
//...
},
productEntities: {
productId1: {},
productId2: {},
//...
}
}
通过ID连接不同的实体,我现在可以选择必要的数据
问题
我必须执行3个不同的API调用来获取所有数据,并希望在其间显示一个加载微调器。因为有3种不同的副作用,我不知道如何更新状态中的{loading:boolean,loaded:boolean}
仅当用户
和产品
均已成功加载时,加载的才应为true
因为我想在应用程序的其他部分重复使用LoadUsers
和LoadProducts
,所以当这些副作用结束时,我不能将loaded
的评论设置为true
。我猜你是在@effects
内发出请求的。如果您有n个请求,您可能希望使用一些组合运算符来激发它们,如:forkJoin
、combinelateest
或zip
forkJoin
可能是一个好的开始:
获得所有响应后,您可以启动xCompleteAction
,设置加载:false
附言。
良好的心理模型是,加载程序状态与实际的api调用无关,而是与效果有关,而效果又可以通过发送单个或多个api调用对单个操作作出反应。您可以将加载状态视为当前未完成的请求数
因此,在分派请求之前,您可以分派正在进行的请求,负载增量为1,当请求完成/出错时,您可以分派正在进行的请求,负载增量为1。如果需要,您甚至可以添加一些“范围”
我处理类似特性的方法是通过角度拦截器调度递增/递减事件。我对全局加载状态非常满意。好的,听起来很棒!你能不能附上一个例子,说明这种效果是如何发挥作用的,因为我似乎无法让它发挥作用。()你应该在这里找到你想要的例子:这里有几种解决方案/方法谢谢,这很有帮助!您知道如何从forkJoin
内部分派操作吗?forkJoin(observedscollection).map(result=>newaction(result))
。示例:.map
不存在。我还尝试使用.pipe(map(result=>…)
,但是结果没有定义