は2角度 -</p> <pre><code><a [routerLink]="[/Person']">Person</a> </code></pre> <p>、私は以下のように<code><a></code>タグを持っているルート

Question

にパラメータを渡すだから私はこの/Personルータにperson.idを渡したいです。コンポーネントに

<a [routerLink]="['/Person', person.id]">Person</a> 

ハンドル：私はそれが角1

Answer 1

パスようにそれを渡すことができます：

this.route.params.subscribe(
    (params : Params) => { 
     this.id = params["id"]; 
    } 
); 

第二の方法：あなたは（ルートプロパティとしてなど）ActivatedRouteを注入する必要がある。この例では

this.route.params.forEach(
    (params : Params) => { 
     this.id = params["id"]; 
    } 
); 

ような：

constructor(private route : ActivatedRoute) {} 

あなたが購読している場合 - 退会することが重要ですObservableを防止するメモリリーク。

フル例：

export class SimpleComponent implements OnInit, OnDestroy { 
    private id : number; 
    private route$ : Subscription; 
    constructor(private route : ActivatedRoute) {} 

    ngOnInit() { 
     this.route$ = this.route.params.subscribe(
      (params : Params) => { 
       this.id = +params["id"]; // cast to number 
      } 
     ); 
    } 
    ngOnDestroy() { 
     if(this.route$) this.route$.unsubscribe(); 
    } 
} 

構成：

export const routes = [ 
    ... 
    { path : 'Person/:id', component : ...}, 
    ... 
]; 

また、@RouteConfigはをを廃止予定です。

Answer 2

にparamsよう@RouteConfigにそれを扱う&渡すことができますどのようにリンクをルータに

<a [routerLink]="[/Person', propertyWithId]">Person</a> 

Answer 3

私の場合、[routerLink]の指示は私のためには機能しませんでした。だから私はプログラムでそれをやらなければならなかった。

コンポーネントテンプレート：

<a (click)="goToEdit(person.id)" >Edit</a> 

コンポーネントクラス：

import { Router } from '@angular/router'; 

export class PersonComponent{ 

    constructor(private _route: Router){ } 

    goToEdit(id){ 
     this._route.navigate(['Person/' + id]); 
    } 

}