Emberjs Rendering other Templates within another template

Question

I would like to render the template 'location' within a sidebar in the template 'permit'. My code is a replica of the code shown on emberjs.com's rendering templates example but the 'location' template is either not loading at all, or loading just the 'locations' template in repeat but not rendering the original html in the 'permit' template. So the location.hbs is displayed but not inside the sidebar it's been assigned to.

Here's some code :D

<!-- Right Sidebar (a small piece of the 'permit' template) START -->
    <div id="sidebar-wrapper" class="super-super-float-right-col">
      <div id="sidebar-wrapper" class="super-float-right-col">
        <div id="sidebar-wrapper" class="float-right-col">
          {{outlet location}}
        </div>
      </div>
    </div>
  <!-- Right Sidebar END -->


VpcYeoman.PermitRoute = Ember.Route.extend({
    renderTemplate: function() {
        this.render('location');
    }
});

router.js

VpcYeoman.Router.map(function () {
...
  this.resource('permit', { path: '/permit/:permit_id' });
...
});

http://emberjs.com/guides/routing/rendering-a-template/ is once again being vague and of little help.

emberjs community assemble!

Kingpin2k · Accepted Answer · 2013-11-25 16:50:08Z

3

You've created a named outlet, but aren't telling it to render into that named outlet. The code you are using is saying render the location template, instead of the default template (permit). You would do something along the lines below

this.render('location', {   // the template to render
  into: 'permit',                // the route to render into
  outlet: 'location',              // the name of the outlet in the route's template
  //controller: 'blogPost'        // the controller to use for the template
});

answered Nov 25, 2013 at 16:50

Kingpin2k

47.4k10 gold badges80 silver badges97 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ian Steffy · Accepted Answer · 2013-11-25 17:13:39Z

0

Thanks for the help, kingpin!

http://emberjs.com/guides/routing/rendering-a-template/ is quite misleading when compared to the solution.

What is written in the PermitRoute must be the same as what is written in the .hbs file, with the addition of a colon.

renderTemplate: function() {
    this.render({ render:'location'});
}

so what would be put into the HTML would not be {{outlet location}}, as their website claims, which will render only 'location' and not 'permit' but {{render 'location'}} will render a template within a template.

answered Nov 25, 2013 at 17:13

Ian Steffy

1,2344 gold badges21 silver badges51 bronze badges

1 Comment

Michael Johnston Over a year ago

or, you could still use your named outlet and do this.render(); (that will render permit, by convention) and this.render('location', {outlet: 'location'}); to render the sidebar. The key point is that if you override renderTemplate you need to call super or call this.render(); if you still want the default render to happen.

Collectives™ on Stack Overflow

Emberjs Rendering other Templates within another template

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related