首先,需要在定义路由时指定参数名称。例如:
{
path: 'product/:id',
component: ProductDetailComponent
}
这里的参数名称是"id"。然后,在组件中通过ActivatedRoute服务获取参数值。例如:
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-product-detail',
template: `
Product Detail
Product ID: {{ productId }}
`
})
export class ProductDetailComponent implements OnInit {
productId: string;
constructor(private route: ActivatedRoute) {}
ngOnInit() {
this.productId = this.route.snapshot.paramMap.get('id');
}
}
在这个示例中,使用ActivatedRoute服务获取参数值,以便在组件中使用。注意使用snapshot属性获取参数值。如果需要在路由参数值发生更改时动态更新值,则需要订阅paramMap属性。
下一篇:Angular路由参数问题