ngrx存储选择器触发无需操作的效果请求

时间:2018-05-24 20:14:39

标签: angular ngrx ngrx-store ngrx-effects

使用Angular 6和NGRX。

我在效果中使用商店选择器来获取请求的数据。在我第一次调用操作SignalAction.LOAD_SIGNAL之后,如果在此之后的任何时候存在导致选择器getRequestParams更新的商店更改。触发请求时不会触发操作。

我应该采用不同的方式处理这个问题吗?我只希望可观察流完全通过一个动作。

我在商店选择器之后尝试take(1),但请求只能运行一次。

@Injectable()
export class SignalEffect {

    constructor(
        private _signalService: SignalService,
        private _actions$: Actions,
        private _store$: Store<IStore>,
    ) {}

    @Effect()
    public fetchSignal(): Observable<IAction<SignalModel[] | HttpErrorResponse>> {
        return this._actions$
            .ofType(SignalAction.LOAD_SIGNAL)
            .pipe(
                switchMap((action: IAction<void>) => this._store$.select(getRequestParams)),
                switchMap((requestParams: RequestParamsModel) => {
                    return this._signalService.getSignal(requestParams)
                        .pipe(
                            map((responseModel: SignalResponseModel | HttpErrorResponse) => {
                                if (responseModel instanceof HttpErrorResponse) {
                                    return ErrorsAction.requestFailure(responseModel);
                                }

                                return SignalAction.loadSignalSuccess(responseModel.results);
                            }),
                        );
                }),
            );
    }

}

1 个答案:

答案 0 :(得分:3)

尝试将您的第一个.pipe移至ofType之前。

@Effect()
public fetchSignal(): Observable<IAction<SignalModel[] | HttpErrorResponse>> {
  return this._actions$
    .pipe(
      ofType(SignalAction.LOAD_SIGNAL),
      withLatestFrom(this._store$.select(getRequestParams)),
      switchMap(([action, requestParams: RequestParamsModel]) => {
        return this._signalService.getSignal(requestParams)
          .pipe(
            map((responseModel: SignalResponseModel | HttpErrorResponse) => {
              if (responseModel instanceof HttpErrorResponse) {
                return ErrorsAction.requestFailure(responseModel);
              }

              return SignalAction.loadSignalSuccess(responseModel.results);
            }),
        );
      }),
  );