Angular 2 - 将参数传递给Route

Dil*_*umN 16 angular-ui-router angular

我有一个<a>如下标签,

<a [routerLink]="[/Person']">Person</a>
Run Code Online (Sandbox Code Playgroud)

所以我想传递person.id给这个/Person路由器.我怎样才能将它传递与处理它@RouteConfigparams在1角

Kam*_*iec 25

传递给路由器链接:

<a [routerLink]="['/Person', person.id]">Person</a>
Run Code Online (Sandbox Code Playgroud)

处理组件:

this.route.params.subscribe(
   (params: Params) => {
      this.id = params['id']; 
   }
);
Run Code Online (Sandbox Code Playgroud)

第二种方式:

this.route.params.forEach(
   (params: Params) => {
       this.id = params['id'];
   }
);
Run Code Online (Sandbox Code Playgroud)

在这个例子中,你必须像这样注入ActivatedRoute(例如作为路由属性):

constructor(private route: ActivatedRoute) {}
Run Code Online (Sandbox Code Playgroud)

如果您订阅 - 取消订阅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();
    }
}
Run Code Online (Sandbox Code Playgroud)

配置:

export const routes = [
    ...
    { path : 'Person/:id', component : ...},
    ...
];
Run Code Online (Sandbox Code Playgroud)

此外,@RouteConfig弃用.