Different routes same component

Question

I want to achieve something like this /products shows all the products and /products/:category shows all the products related to a specific categor

Answer 1

You can solve it by using redirect,

const productsRoutes: Routes = [
  {
    path: 'products',
    component: ProductsComponent,
    children: [
        {
            // path => '/products'
            path: '',
            redirectTo: ':category',
        },
        {
            // path => '/products/:category'
            path: ':category',
            component: ProductsListComponent
        }
    ]
  }
];

It's more like set one path default, unless there is a matching path.