Lesson 15 / 30

Route Parameters

Read dynamic segments of the URL, like an item id.

A parameterized route

A colon marks a dynamic segment: :id matches any value at that position in the URL.

export const routes: Routes = [
  { path: 'products/:id', component: ProductDetailComponent },
];

Reading the param

ActivatedRoute exposes the current route's parameters, either as a snapshot or an observable.

export class ProductDetailComponent {
  private route = inject(ActivatedRoute);
  productId = this.route.snapshot.paramMap.get('id');
}