How to group routes using angular ui-router?

Question

How to group routes in ui-router?

For example, i have following routes in my app

#/products/p1
#/products/p2
#/products/p3

One way of defining states will be,

.state(‘products.p1’)
.state(‘products.p2’)
.state(‘products.p3’)

But i am looking for something like followings, Is it possible to do so?

.state(‘products’,{
  ‘p1’ : {},
  ‘p2’ : {},
  ‘p3’ : {} 
})

Answer 1

This should be managed by parameters

#/products/p1 // parameter p with value p1
#/products/p2 // still parameter p with value p2
#/products/p3 // value is p3

state can have it defined like this

.state('products', {
    url: "/products/:p
    ...
})