Question

我在我的应用中使用了NGRX效果。当它失败时，似乎会中断数据流。

@Effect()
createUser$: Observable<Action> = _action$.ofType(fromUser.CREATE_NEW_USER_ACTION)
  .pipe(
    mergeMap((action: fromUser.CreateNewUserAction) =>
      this._tokenService.post('users', action.payload)
        .pipe(
          map(response => {
            this._router.navigate(
              ["dashboard", "users", "view"],
              { queryParams: { id: response.json().message.id } });
            return new fromUser.CreateNewUserCompleteAction(response.json().message);
          },
            catchError(error =>
              of(new fromUser.CreateNewUserFailedAction(error.json().message))
            )
          )
        )
    )
  );

错误操作从未触发，我尝试记录。

Answer 1

您的tokenService返回什么？它可能正在内部处理API调用中的任何错误。只要您的API调用未隐藏错误事件，CatchError就应该起作用。如果是这种情况，您可能需要使用Observable.throw（）从该服务抛出错误。

为了提高可读性，我通常将效果的格式设置为这样。

@Effect() updateUser$: Observable<Action>;

constructor(action$: Actions, tokenService: TokenService) {
this.updateUser$ = action$.ofType(fromUser.UPDATE_USER_ACTION)
.pipe(
    mergeMap((action: fromUser.UpdateUserAction) => 
        tokenService.patch(`users/${this.user.id}`, action.payload)
           .pipe(
              map(response => {
                 this._router.navigate(
                    ["dashboard", "users", "view"], 
                    { queryParams: { id: response.json().message.id } });
                 return new fromUser.UpdateUserCompleteAction(response.json().message); 
              },
              catchError(error => 
                 of(new fromUser.UpdateUserFailedAction(error.json().message))
              )
           )
        )
    )
);
}

此代码看起来应该可以工作。看看您的TokenService。

Answer 2

看起来像您的parentheses没有正确放置在第二个pipe函数中。 map和catchError应该在管道内平行。在您的代码中，catchError函数位于map内部。

@Effect()
createUser$: Observable<Action> = _action$.ofType(fromUser.CREATE_NEW_USER_ACTION)
  .pipe(
    mergeMap((action: fromUser.CreateNewUserAction) =>
      this._tokenService.post('users', action.payload)
        .pipe(
          map(response => {
            this._router.navigate(
              ["dashboard", "users", "view"],
              { queryParams: { id: response.json().message.id } });
            return new fromUser.CreateNewUserCompleteAction(response.json().message);
          }),
          catchError(error =>
            of(new fromUser.CreateNewUserFailedAction(error.json().message))
          )
        )
    )
  );

顺便说一句，这是一个好的实践，将catchError与http请求一起放置，而不是放入外部pipe流中，这可能会停止{{1} }可见， NGRX 框架将不会收到任何后续动作。

NGRX Effects会因错误而中断应用程序，如何处理错误？

2 个答案: