Javascript ngrx副作用:等待存储数据或取消

Javascript ngrx副作用:等待存储数据或取消,javascript,angular,rxjs,reactive-programming,ngrx,Javascript,Angular,Rxjs,Reactive Programming,Ngrx,请让我提供一些背景信息: 在我的应用程序中,我有一个“功能”列表。特征具有ID和状态(激活:布尔值)。我在ngrx商店中管理这些功能。它基本上是这些特性的一系列。这些功能必须从服务器获取,并且可以在运行时更改。应用程序启动后和其他事件时更新商店。角度分量观察这些特征。大多数按状态筛选功能(因此大多数只对活动功能感兴趣)。 为了激活功能,组件需要调度activate\u功能操作,或者特定URL必须处于活动状态。一些功能注册在URL路径上,而其他功能注册在URL参数上 我已经使用ngrx路由器存储观

请让我提供一些背景信息:

在我的应用程序中,我有一个“功能”列表。特征具有ID和状态(激活:布尔值)。我在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。(我们也在收听商店的节目,因此如果以后添加了功能,我们会关注它)。

非常感谢!你为我指明了正确的方向!