Angular Ngrx 中的火焰效果方法时出现错误

Question

我使用Angular 7 NGRX状态系统。

当我从我的组件调度这个方法时，我收到错误。

参数正确。我都检查过了。我想我使用了 "mergeMap" 和 "return" 错误的值。

这段代码哪里弄错了？

错误：

ERROR Error: Effect "StudentEffects.addReview$" dispatched an invalid action: [object Object] .....

ERROR TypeError: Actions must have a type property

操作方法：

export class AddReview implements Action {
  readonly type = ActionTypes.AddReview;
  constructor(public payload: { guruId: string, review: IReview }) { }
}


export class AddReviewSuccess implements Action {
  readonly type = ActionTypes.AddReviewSuccess;
  constructor(public payload: { guruId: string, review: IReview }) { }
}

效果方法：

  @Effect()
  addReview$ = this.actions$.pipe(
    ofType<StudentActions.AddReview>(StudentActions.ActionTypes.AddReview),
    mergeMap(action => {

      return this.personApi.findOne({ where: { id: action.payload.guruId } }).pipe(
        map((guru: Person) => {

          let reviews: Array<IReview> = Array.isArray(guru._reviews) ? guru._reviews : [];
          reviews.push(action.payload.review);

          let attrs = {
            _reviews: reviews,
          };

          return this.personApi // => Not goes inside. I get error.
            .patchAttributes(guru.id, attrs)
            .pipe(
              map(person => {

                this.notificationService.createNotification(
                  'success', 'Success', 'Your review successfully saved.'
                );

                this.logService.groupLog('AddReview', action, person);

                return new StudentActions.AddReviewSuccess({ guruId: guru.id, review: action.payload.review });

              }),
              catchError(() => {
                // this.notificationService.createNotification(
                //   'error',
                //   'Error',
                //   'There is an error on save'
                // );
                console.error('There was an error');
                return EMPTY;
              })
            );
        }),
        catchError(() => EMPTY)
      );
    })
  );

Reducer 方法：

case ActionTypes.AddReview: {
      return {
        ...state,
        loading: true
      };
}
case ActionTypes.AddReviewSuccess: {
  return {
    ...state,
    reviews: [
      ...state.reviews,
      { guruId: action.payload.guruId, review: action.payload.review }
    ],
    loading: false
  };
}

Answer 1

我发现了错误。

有效方法：

这一行：map((guru: Person) => {

应该是：mergeMap((guru: Person) => {

Angular Ngrx 中的火焰效果方法时出现错误

Getting Error When Fire Effect Method In Angular Ngrx

node.js

angular

ngrx

ngrx-effects