ngrx 商店选择器无需操作即可触发效果请求

Question

使用 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);
                            }),
                        );
                }),
            );
    }

}

Answer 1

尝试将您的第一个 .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);
            }),
        );
      }),
  );

ngrx 商店选择器无需操作即可触发效果请求

ngrx store selector triggers effect request without action

ngrx

ngrx-effects

angular

ngrx-store