我们正在创建一个小的Angular app poc(角度4.2.4,bootrap 4.0.0-beta2,ng-bootstrap 1.0.0-beta6,typescript 2.3.3) .

该应用程序将以模板驱动的形式显示用户数据 . 设置路由,以便在导航到localhost:4200时默认加载父组件 . 这个父组件有一个side-nav子组件,以及一个带有 <router-outlet> 的内容区域,其中子组件显示取决于在side-nav上做出的选择 - 非常简单(参见下面的代码片段) . 每个子组件应在表单中显示用户数据的特定部分 .

当应用程序启动时,父级的 ngOnInit 方法使用服务来调用 endpoints 以一次性检索所有用户数据 . 这一切都很好 - 服务是在角度巡回英雄服务之后建模的,我们有这方面的经验 . 我还想使用共享服务来保持这个检索到的用户,这样子组件就不必在每次显示时都获取它 . 我've provided this shared service once in the app' s @NgModule . 当创建第一个子组件以显示在父_2978453中时,自己的_2978454被调用,其中我尝试在调用父亲的 ngOnInit 时检索我刚刚放在服务上的User对象 .

父模板:

<div class="container">
  <div class="row">
    <div class="col-3">
      <user-sidenav></user-sidenav>
    </div>
    <div class="col-9">
      <router-outlet></router-outlet>
    </div>
  </div>
</div>

parent ngOnInit:

ngOnInit(): void {
        this.userService.getUser(1)
            .then(user => this.userService.currentUser = user);
  }

孩子ngOnInit:

ngOnInit() {
    this.currentUser = this.userService.currentUser;
  }

我相信我知道_2978459知道如何解决 . 如果错误请纠正我 . 由于父级的 ngOnInit 正在努力解决一个承诺,因此检索用户并将其置于服务上是异步操作 . ngOnInit 完成并继续执行其承诺代码 . 同时,很快,子组件的 ngOnInit 被调用,因为它是父组件的默认子路由 . 它期望User对象在服务上可用,并尝试检索它 . 由于我已完成,因此异步承诺代码尚未完成将User对象放在服务上 - 因此未定义的数据和错误 .

现在我的服务没有使用"the Angular way"使用Subject来处理共享数据 . 我一开始就是这样做的,但无论如何我都没有做出任何改变 . 另外,我需要为每个子路线使用不同的解析器 - 但不确定 . 否则,似乎我可能需要检索每个子组件的 ngOnInit 方法中的数据,我觉得使用共享服务会帮助我避免 .

在呈现页面之前,确保子组件属性值设置的最佳或首选方法是什么?