Rendering the ProductDetails Component
Explore how to render the ProductDetails Ember component on a nested item route by creating an index route, linking products dynamically, and setting up route handlers to display detailed product information.
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 ...