,可以通过使用ngrx的withLatestFrom
操作符来实现。
withLatestFrom
操作符可以将一个或多个Observables的最新值与源Observable的值进行组合。在这种情况下,我们可以将状态Observable和有效负载数据Observable进行组合。
具体实现步骤如下:
withLatestFrom
操作符和其他必要的rxjs操作符:import { withLatestFrom } from 'rxjs/operators';
import { Observable } from 'rxjs';
ofType
操作符来筛选出需要处理的动作类型。假设我们的动作类型为FETCH_DATA
:import { ofType } from '@ngrx/effects';
// ...
@Effect()
fetchData$ = this.actions$.pipe(
ofType(FETCH_DATA),
// ...
);
fetchData$
效果中,使用withLatestFrom
操作符来获取状态和有效负载数据:import { Store } from '@ngrx/store';
import { AppState } from '../app.state';
// ...
constructor(private actions$: Actions, private store: Store<AppState>) {}
// ...
@Effect()
fetchData$ = this.actions$.pipe(
ofType(FETCH_DATA),
withLatestFrom(this.store.select(state => state.myState), (action, state) => ({ action, state })),
// ...
);
在上面的代码中,this.store.select(state => state.myState)
表示获取状态中的myState
属性。你可以根据实际情况修改这部分代码。
fetchData$
效果中,可以通过解构赋值来获取状态和有效负载数据,并进行后续处理:@Effect()
fetchData$ = this.actions$.pipe(
ofType(FETCH_DATA),
withLatestFrom(this.store.select(state => state.myState), (action, state) => ({ action, state })),
switchMap(({ action, state }) => {
// 处理状态和有效负载数据
// ...
// 返回一个新的Observable,用于发出其他动作或进行其他操作
return of(...);
})
);
在上面的代码中,action
表示原始动作对象,state
表示状态中的myState
属性。
通过以上步骤,我们可以在ngrx效果中同时访问状态和有效负载数据,并进行相应的处理。具体的处理逻辑和返回值根据实际需求进行编写。
推荐的腾讯云相关产品和产品介绍链接地址:
请注意,以上链接仅供参考,具体选择和使用腾讯云产品时,请根据实际需求和情况进行评估和决策。
领取专属 10元无门槛券
手把手带您无忧上云