dynamic outlet name in ember js

Question

Requirement: There will be few buttons, and on clicking every button the immediate outlet will be rendered with a view. (not the other outlets present in the page)

Suppose I'm creating outlets in #each.

{{#each item in model}}
<#link-to 'passenger' item.id>Open Corresponding Outlet </link-to>
{{outlet item.id}}
{{/each}}

and from back i'm rendering the outlet:

model: function (params) {
    return [
              { id: params.passenger_id}
           ]
    },

renderTemplate: function () {
     this.render({ outlet: this.get('controller.model')[0].id });
    },

This just doesn't work.

Can anyone help me to do that?

Answer 1

You can't create dynamic named outlets, and it would break the url representing the page you are viewing concept which the core members preach heavily.

You should just render in the template using the render helper, and use

{{#each item in model}}
  {{render 'something' item}} 
{{/each}}

And inside the something controller/template you can add additional logic for how you'd like it to interact.

Additionally you could just add another resource under your passenger route and ad an outlet which hosts that information when it's clicked.

Answer 2

Not sure if you're still looking for a solution, as @kinpin2k mentioned you can't use dynamic outlets, but perhaps a dynamic partial would help.

Like so:

{{partial someTemplateName}}

Where someTemplateName can be any computed property in your controller. If the property returns falsy then nothing will be displayed.

Here's the reference: http://emberjs.com/api/classes/Ember.Handlebars.helpers.html#toc_bound-template-names