0

我正在使用@ngrx/store和 observables。我有一个用户化简器，它设置有关用户的信息，包括用户的 JWT。

ANavigationService被注入到AppComponent订阅user模型的根中，并将根据用户令牌的存在进行路由。AUserService读取本地存储并将user结果分派给reducer。

问题是，当我尝试使用以下命令路由到主页时goToLogin()，出现以下错误......这并没有提供太多信息。

我猜还没有设置路由组件。有没有办法在路由之前等待应用程序加载？或者下面的错误是否表明不同的问题？

@Injectable()
export class NavigationService {
  private subscription: any;

  constructor(public router:Router, private userService: UserService) {
    this.subscription = this.userService.token$.subscribe(token => {
       if (token) {
         this.goToSecretStuff();
       } else {
         this.goToLogin();
       }
    });
  }


TypeError: Cannot read property 'constructor' of undefined
    at Object.implementsOnDestroy (pipe_lifecycle_reflector.ts:2)
    at Function.ChangeDetectionUtil.callPipeOnDestroy (change_detection_util.ts:209)
    at AbstractChangeDetector.ChangeDetector_CohortList_0.dehydrateDirectives (viewFactory_CohortList:91)
    at AbstractChangeDetector.dehydrate (abstract_change_detector.ts:177)
    at AbstractChangeDetector.destroyRecursive (abstract_change_detector.ts:200)
    at AbstractChangeDetector.destroyRecursive (abstract_change_detector.ts:207)
    at AbstractChangeDetector.destroyRecursive (abstract_change_detector.ts:207)
    at AppView.destroy (view.ts:159)
    at AppViewManager_.destroyViewInContainer (view_manager.ts:286)
    at ViewContainerRef_.remove (view_container_ref.ts:166)
    at ComponentRef_.dispose [as _dispose] (dynamic_component_loader.ts:283)
    at ComponentRef_.dispose (dynamic_component_loader.ts:87)
    at router_outlet.ts:108
    at e.run (zone-microtask.min.js:8)
    at e.run (ng_zone.ts:371)
    at zone-microtask.min.js:8
    at z (zone-microtask.min.js:8)
    at A (zone-microtask.min.js:8)
    at zone-microtask.min.js:8
    at zone-microtask.min.js:1
    at microtask (ng_zone.ts:410)
    at e.run (zone-microtask.min.js:8)
    at e.run (ng_zone.ts:371)
    at zone-microtask.min.js:8
    at MutationObserver.h (zone-microtask.min.js:8)
4

1 回答 1

0

像这样的接缝是一个已知的错误#5169，#6425，正如@nathasm 在评论中提到的那样。

async解决方法是如果/当它抛出错误时从路由组件的模板中删除管道：

TypeError：无法读取未定义的属性“构造函数”

更新：

我一直在对此进行更多研究，但找不到任何避免管道错误的方法；（甚至尝试创建自己的|asynx管道。我发现解决此问题的最佳方法（并且更改最少）是订阅constructor()并触发更改检测在routerOnActivate()

  constructor(public store: Store<any>, private _cdref: ChangeDetectorRef) {
    // this.items$ = this.store.select('items');
    this.store.select('items')
      .subscribe(items => this.items = items);
  }
  routerOnActivate(next, prev) {
    this._cdref.markForCheck();
  }

在我的具体情况下，我可以摆脱大部分样板文件，因为我的路由组件扩展了已经做了一些事情的基类onActivate()：

export class ItemListRoute extends _BaseRoute {
  public items: any;
  constructor(public store: Store<any>) {
    super(store);
    this.store.select('items')
      .subscribe(items => this.items = items);
  }
}
于 2016-02-20T05:27:37.107 回答