angular 2 - 从活动组件获取信息

Question

我有一个带标题和正文的页面。标题有一个HELP按钮，应该打开文档。文档链接由 help-id 参数化，取决于当前显示的页面。

我需要在标头中更新 help-id ，具体取决于路由器当前显示的组件。换句话说，从当前活动的组件获取此参数（这是一个简单的字符串）的正确方法是什么？

我已经看到使用服务进行通信，但似乎为这么简单的任务创建服务有点过分。

我试图从Router和ActivatedRoute代码中推断出一些东西，但我无法得到任何有效的东西。导航事件不包含对组件的任何引用，加载应用程序时routerState.root.firstChild为空。

编辑：

此处，AppComponent我需要当前的 help-id

export class AppComponent {
  private helpId;
}

我在路由器插座中显示的组件具有此属性，例如

export class HeroComponent {
  const helpId = 'hero';
}

export class HeroDetailsComponent {
  const helpId = 'hero-details';
}

为每个组件定义了路由，例如

const heroesRoutes: Routes = [
  { path: 'heroes',  component: HeroComponent },
  { path: 'hero/:id', component: HeroDetailsComponent }
];

我需要当前显示的组件的 help-id （由路由器呈现），以使标题中的帮助链接保持最新。 help-id 未在路线参数中传递。

Answer 1

确实可以使用 ActivatedRoute 来完成。

您需要在组件中注入它：

contructor(private route: ActivatedRoute) {} 

然后你需要听取路线改变事件，例如：

ngOnInit() {
    this.route.params.subscribe(params => {
        // route info is stored in `params`
        console.log(params);
    });
}