角度2ルートparamが

Question

私は1つのパラメータを使用して簡単なルートを持っていますちょうどAppComponentテンプレートでそれを表示する：私はのような動的なタイトルを持つようにしたい場合は

<h1>{{ title }}</h1> 

は問題があります。どのように追加することができますか？ param（：id）または変数をデータタイトルプロパティにルーティングしますか？

{ 
    path: 'item/:id', 
    component: ItemComponent, 
    data: {title: 'Item detail #' + :id } 
} 

Answer 1

ような何か私がコメントで言ったように、あなたは青写真としてdata.titleのparamを維持し、コンポーネント内から動的な部分を置き換えることができます。

ルート宣言：data.titleで

{ 
    path: 'item/:id', 
    component: ItemComponent, 
    data: { title: 'Item detail [id]' } 
} 

、私は、交換を容易にするために[id]を書いていますが、交換する文字列をdelimitateしたいのですがどんな記号を使用して自由に感じます。

その後、コンポーネントで：

export class AppComponent { 
    title: string; 

    constructor(private route: ActivatedRoute) {} 

    ngOnInit() { 
    const titlePattern = this.route.snapshot.data['title']; 
    const id = this.route.snapshot.params['id']; 
    this.title = titlePattern.replace('[id]', id); 
    } 
}