在Angular 2中,你可以使用路由激活和输入接收组件来获取路由参数并在组件中使用它们。下面是一个示例解决方法:
首先,定义一个路由路径,包含一个参数:
const routes: Routes = [
{ path: 'user/:id', component: UserComponent }
];
接下来,在组件中导入ActivatedRoute
和Params
:
import { ActivatedRoute, Params } from '@angular/router';
然后,在组件的构造函数中注入ActivatedRoute
:
constructor(private route: ActivatedRoute) { }
接下来,在组件的ngOnInit
生命周期钩子中订阅参数的变化:
ngOnInit() {
this.route.params.subscribe((params: Params) => {
const id = params['id'];
// 在这里使用参数,例如从后端获取用户数据
});
}
现在,你可以在组件中使用id
参数,例如在模板中显示它:
User ID: {{ id }}
这就是如何在Angular 2中使用路由激活和输入接收组件的解决方法。希望对你有帮助!