Question

根据angular2中的路径路径输出页面标题的最佳方法是什么，而不是硬编码标题，我想在控制器中输出标题。< / p>

如果用户转到/dashboard，信息中心页面将显示信息中心标题：

{ path: 'dashboard', component: dashComponent}

某处：

if(path==dashboard){
   title:string = "Dashboard"
} else if(path==something){
   title:string = "Something"
}

HTML输出：

<h1>{{title}}</h1

这个逻辑有效，但重复location.path似乎有点乏味

if(this.location.path() == '/order-ahead'){
        console.log('Dashboard')
        this.title = 'Dashboard';
    } else {
        console.log('its something else');
        this.title = 'Something Else'
    }

Answer 1

我想，您应该使用更复杂的逻辑来实现更复杂的解决方案。例如，使用CanActivated后卫，例如此票证中的内容：Angular 2 RC4 Router get intended route before activated

Answer 2

我认为您可以按照文档中的指导通过import { Title } from '@angular/platform-browser'; bootstrap(AppComponent, [ Title ])服务设置标题：

export class AppComponent {
  public constructor(private titleService: Title ) { }

  public setTitle( newTitle: string) {
    this.titleService.setTitle( newTitle );
  }
}

然后在您可以访问路径的组件中使用以下内容：

form

以下是有关此文档的链接：this .NET Fiddle

Answer 3

最简单的解决方案，订阅路由器中的路由更改（路由器的beta 3.0-2示例）：

import { Router, Event, NavigationEnd } from '@angular/router';

constructor(protected router: Router)
    {
        this.router.events.subscribe(this.routeChanges.bind(this));
    }

    protected routeChanges(event: Event)
    {
        if (event instanceof NavigationEnd) {
            let url = event.url;
        }
    }

angular2获取路径路径作为标题页

HTML输出：

3 个答案: