adam
adam

Reputation: 800

How to bypass rendering the parent template in ember.js?

I have a hierarchy of nested routes in my ember app. I want one of the child routes to bypass rendering it's parent template and render directly into the application template. However, I still want to keep the route hierarchy, because I need the models from the parent routes in the child route. What I did is I defined the renderTemplate hook on the child route to render into the application:

renderTemplate: function() {
  this.render({ into: "application" });
}

This works, but when I then click on a link to the parent route, nothing is rendered. I put together a small jsfiddle to demonstrate this: http://jsfiddle.net/H7gvz/1/ - run it, then click on one of the names, then click on "Index". I expect the PeopleRoute to render the people template but instead nothing is rendered.

Is this a bug or am I doing it totally wrong? What should be the correct way to do this?

Upvotes: 2

Views: 1462

Answers (1)

selvagsz
selvagsz

Reputation: 3872

Whenever you use nested routes, transitioning from child route ('people.show') to parent route ('people'), will be redirected to the 'index' route. Rendering your 'people' template in App.PeopleIndexRoute will solve your problem.

App.PeopleIndexRoute = Em.Route.extend({
renderTemplate: function() {
    this.render('people',{ into: "application" });

}  
});

Your working fiddle

Upvotes: 5

Related Questions