NGXS-在switchMap中返回(any)时提供的无效对象

时间:2018-09-25 17:39:23

标签: angular typescript rxjs angularfire2 ngxs

我有一个操作是从Firebase的authState获取用户的。如果用户存在,则代码返回与用户相关的文档。否则,将返回of(null)

类AuthState

ngxsOnInit({dispatch}: StateContext<AuthStateModel>) {
  dispatch(SyncAuth);
}

@Action(SyncAuth)
syncAuth({dispatch}: StateContext<AuthStateModel>) {
  return this.afAuth.authState.pipe(
    switchMap(fireAuth => fireAuth ? this.authService.auth$(fireAuth.uid) : of(null)),
    tap(user => dispatch(new PatchUserData(user)))
  );
}

Class AuthService

auth$(userId: string): Observable<User> {
  if (!userId) {
    return of(null);
  }

  return this.db.doc$(`users/${userId}`).pipe(
    map(user => user ? this.transform({...user, id: userId}) : null),
    shareReplay(1)
  );
}

看起来很简单,对吧?好吧,除非您的Redux Devtools插件打开(是的,我知道这很奇怪),否则它将无法正常工作。

当我想在switchMap运算符内返回具有任何类型(例如数字,字符串,空值甚至未定义)的值的可观察对象时,出现以下错误:

  

未捕获到的TypeError:您提供了一个无效对象,该对象应用于流。您可以提供一个Observable,Promise,Array或Iterable。 (zone.js:192)

at subscribeTo (subscribeTo.js:41)
at subscribeToResult (subscribeToResult.js:6)
at SwitchMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/switchMap.js.SwitchMapSubscriber._innerSub (switchMap.js:47)
at SwitchMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/switchMap.js.SwitchMapSubscriber._next (switchMap.js:40)
at SwitchMapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
at angularfire2.js:49
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
at Object.onInvoke (core.js:3820)
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)

问题所在的行在我的AuthState类中:

// fireAuth === null
switchMap(fireAuth => fireAuth ? this.authService.auth$(fireAuth.uid) : of(null)),

但是,如果我删除of运算符并返回authService.auth$可观察的结果(返回of(null),则错误消失了:

1 个答案:

答案 0 :(得分:0)

有时候,我们对我们的IDE非常信任。有时候我们不应该。我的IDE通过这种方式导入了运算符:

import { of } from 'rxjs/internals/operators';

代替

import { of } from 'rxjs';