[英]how to get route parameters in angular2 RC5
我使用angular-cli@webpack
将angular2项目升级到RC5
。
我提供如下路由:
const appRoutes: Routes = [
{ path: 'project-manager', component: ProjectManagerComponent },
{ path: 'designer/:id', component:DesignerComponent } ,
{path: '',redirectTo: '/project-manager',pathMatch: 'full'}
];
我使用routerLink重定向到设计器组件:
<a [routerLink]="['/designer', page._id]"><i class="fa fa-eye fa-fw"></i></a>
现在它被重定向成功,我能够在浏览器的地址栏中看到param值。
现在我想知道,如何在angular2 RC5中的DesignerComponent中访问此参数。
我相信您需要使用路由器中的ActivatedRoute来操作您的参数。
import { ActivatedRoute } from '@angular/router';
...
constructor(private route: ActivatedRoute, ...) {
}
// TODO :: Add type
value: any; // -> wanted parameter (use your object type)
ngOnInit() {
// get URL parameters
this.route.params.subscribe(params => {
this.value = params.id; // --> Name must match wanted parameter
});
}
如果您需要,也不要忘记从@angular/core
导入OnInit
。
注意:您也可以使用this.route.snapshot.params
同步访问它。
编辑:
ROUTER_DIRECTIVES
因为它已被弃用。 首先从@angular/router
导入ActivatedRoute
。
import { ActivatedRoute } from '@angular/router';
访问它的构造函数如下:
constructor(private route: ActivatedRoute){
}
在ngOnInit中订阅params更改如下:
ngOnInit() {
this.route.params.subscribe(params => {
if (params['id']) {
}
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.