NgRx 效果不会触发失败条件

Question

我试图用我的效果模拟一个失败案例，但由于某种原因，它没有捕获错误并触发AuthActions.signInError。

facebookSignIn$ = createEffect(() =>
  this.actions$.pipe(
    ofType(AuthActions.facebookSignIn),
    switchMap(() =>
      from(this.authService.facebookSignIn()).pipe(
        map(() => AuthActions.signInSuccess()),
        catchError((err) =>
          of(
            AuthActions.signInError({
              errorMessage: err.message,
              errorCode: err.code,
            })
          )
        )
      )
    )
  )
);

这里是服务：

facebookSignIn(course: ICourse = null): Promise<void> {
  const provider = new firebase.auth.FacebookAuthProvider();
  return this.afAuth
    .signInWithPopup(provider)
    .then(async (result) => {
      if (result) {
        const doc = await this.firebaseService.docExists(`/users/${result.user.uid}/`);
        if (!doc) {
          const user: IUser = {
            uid: result.user.uid,
            email: result.user.email,
            displayName: result.user.displayName,
            photoURL: result.user.photoURL,
          };
          await this.userService.processNewUser(
            user,
            result.additionalUserInfo.profile['first_name'],
            result.additionalUserInfo.profile['last_name']
          );
        }
        if (course) {
          this.builderSignIn(course, result.user.uid);
        }
      }
    })
    .catch((error) => {
      this.toastrService.warning('Something has gone wrong. Please try again.', 'Oops!');
      this.logger.debug('An error occurred during Facebook Sign In');
      this.logger.error(error.message);
    });
}

这是通话记录：

Answer 1

在 promise catch 中，您可能需要重新抛出错误才能在可观察流中捕获它：

.then(....)
.catch((error) => {
  ....
  this.logger.error(error.message);
  throw error; // or throw new Error(error.message)
});