Question

也许这个问题已在某处得到解答，我无法追查这个答案。

我目前正在寻找有关如何将数据从具有路由器插座的父组件传递到将被路由到该父组件的子组件的信息。

我熟悉@Input()和@Output，但我不是在寻找。

以下是我要做的事情：

假设我有一个包含路径/#/users/:id

的父组件

@Component({
    selector: 'parent-cmpt',
    template: `
        <div>
          <h1>User Page</h1>
          <router-outlet></router-outlet>
        </div>
    `
})
export class ParentComponent {

    user: IUser;

    constructor(
      private userService: UserService,
      private route: ActivatedRoute
    ) {
        userService.getUser(route.snapshot.params['id'])
          .subscribe(data => this.user = data);
    }
}

Parent将用户从路由参数拉出:id。现在说我有一个包含路径/#/users/:id/profile的子组件。

@Component({
  selector: 'user-profile'
  template: `
    <div>{{ user.username }}</div>
  `
})
export class UserProfile {

    user: IUser;

    constructor() {
      // I don't Want to pull from API here again.
    }
}

我不想做的是再次注入userService并且必须调用getUser`方法从API重新提取信息。如何从父组件访问已获取的用户对象？

我希望有一些很酷的angular2方法来做到这一点，但作为最后的手段了解我可能需要为此创建一个共享服务，但由于某种原因，我总觉得有点脏。

Angular2子路径数据

0 个答案: