genkilabs
genkilabs

Reputation: 2986

Ember.js: How to render a child route's view into application and navigate back to parent's route

The use case is that I have an index listing displayed in {{outlet}} and I want the detail views for each item to display in the same outlet, owned by 'application'. This is no problem to do with:

renderTemplate: (controller, model)->
this.render('show', {
  into: 'application'
});

However the problem is that when returning to the index page {{#linkTo 'index'}}Index{{/linkTo}} then the index view will no longer render.

The console throws the error: Uncaught TypeError: Cannot call method 'connectOutlet' of undefined

Here is a fiddle reproducing the issue: http://jsfiddle.net/genkilabs/spAbn/3/

What is the correct way to have all my child views display in the application's main outlet?

Upvotes: 1

Views: 944

Answers (1)

CraigTeegarden
CraigTeegarden

Reputation: 8251

All you need to do is shift the show route to be parallel with the index route instead of nested.

App.Router.map ->
  @resource 'index', path: '/'
  @resource 'show', path: ':person_id'

The issue is the show route was originally nested inside of the index route. The renderTemplate call overwrote the original index template with the show template, but Ember still expected the index template to be present in the hierarchy.

JSFiddle Example

Upvotes: 1

Related Questions