Rendering the ProductDetails Component

Let’s render our ProductDetails component in the item route. The item route is a nested and dynamic route. The item route is loaded when a user clicks on a product. We need to create an index route for our category route to achieve this. We’ll render all our product listing of the category route from the index route. The {{outlet}} in the product.hbs template loads the index and item routes.

Creating the index route

We need to add the index route in the category route. We can do this by adding the ...