Javascript ngrx副作用:等待存储数据或取消
请让我提供一些背景信息: 在我的应用程序中,我有一个“功能”列表。特征具有ID和状态(激活:布尔值)。我在ngrx商店中管理这些功能。它基本上是这些特性的一系列。这些功能必须从服务器获取,并且可以在运行时更改。应用程序启动后和其他事件时更新商店。角度分量观察这些特征。大多数按状态筛选功能(因此大多数只对活动功能感兴趣)。 为了激活功能,组件需要调度Javascript ngrx副作用:等待存储数据或取消,javascript,angular,rxjs,reactive-programming,ngrx,Javascript,Angular,Rxjs,Reactive Programming,Ngrx,请让我提供一些背景信息: 在我的应用程序中,我有一个“功能”列表。特征具有ID和状态(激活:布尔值)。我在ngrx商店中管理这些功能。它基本上是这些特性的一系列。这些功能必须从服务器获取,并且可以在运行时更改。应用程序启动后和其他事件时更新商店。角度分量观察这些特征。大多数按状态筛选功能(因此大多数只对活动功能感兴趣)。 为了激活功能,组件需要调度activate\u功能操作,或者特定URL必须处于活动状态。一些功能注册在URL路径上,而其他功能注册在URL参数上 我已经使用ngrx路由器存储观
activate\u功能
操作,或者特定URL必须处于活动状态。一些功能注册在URL路径上,而其他功能注册在URL参数上
我已经使用ngrx路由器存储观察了URL。
我还能够根据URL确定必须激活的功能
现在谈问题:
我想在路由器状态下使用ngrx副作用激活一项功能,如下所示:
@Effect()
private routerEffect = this.actions$.ofType(ROUTER_NAVIGATION)
然后查看有效负载并发送激活功能动作,以便我的功能缩减器将给定功能设置为active:true
。但问题是:如果商店还没有包含该功能呢?还是永远不会?如果用户导航到一个特定的URL,那么这总是可以的,但是如果存储区使用与URL匹配的功能进行更新,那么一旦加载该功能,就应该激活该功能。即使存储仍在加载,也必须能够更改URL。一旦URL不再符合其条件,则必须停用功能
我正在做类似的实验,但我不知道如何处理这个问题
@Effect()
private routerEffect = this.actions$.ofType(ROUTER_NAVIGATION)
.map((nav: RouterNavigationAction<fromRouter.State>) => nav.routerState.data.featureIdToActivate)
.withLatestFrom(this.store.select(fromFeatures.selectAllFeatures)) // this store holds an array of features
// now what?? Is this even correct?
// i would need to dispatch something like {type: 'ACTIVATE_FEATURE', payload: featureIdToActivate}
@Effect()
private routerEffect=this.actions$of type(路由器导航)
.map((导航:路由激活操作)=>nav.routerState.data.featureIdToActivate)
.withLatestFrom(this.store.select(fromFeatures.selectAllFeatures))//此存储包含一个功能数组
//现在怎么办??这是正确的吗?
//我需要分派类似{type:'ACTIVATE_FEATURE',payload:featureIdToActivate}的内容
即使我会设法等待商店包含所需的功能,如何在URL更改时取消等待
非常感谢您的任何建议!谢谢大家! 以下内容对您有帮助吗
@Effect()
router.events
.pipe(
filter(event => event instanceof NavigationEnd) // or whatever you wish
switchMap((event) => {
return store
.pipe(
map((state) => {
const featureId =
getFeatureIdToActivate(event);
return state.features.find(f => f.id === featureId);
}),
filter(feature => feature != null),
map(feature => new ActivateFeatureAction(feature))
);
})
);
在这里,我们正在收听路由器的导航结束事件,或者您想要的任何类型的事件
对于每个事件,我们都会切换映射到存储(这意味着任何新事件都会取消旧事件)
在switchMap中,您可以使用您的逻辑来决定激活哪个功能,因为您同时拥有事件和状态
然后,仅在找到正确的功能时才分派ActivateFeatureAction。(我们也在收听商店的节目,因此如果以后添加了功能,我们会关注它)。非常感谢!你为我指明了正确的方向!