Passing an Ember Handlebars Helper Result to a Component

Question

I'm having some trouble wrapping my head around Ember.js.

I'm trying to pass the value for selected to a component (course-select), but selected has to be determined first using a value derived from the "#each" block (competency.id).

I've written a helper capable of correctly determining the value and can send it back to the template:

{{current-course-helper competency.id}}  // 32

What I need to do is pass the helper result to the component (course-select) as the value for selected.

The code below shows what I would like to do, but having a {{...}} inside another {{...}} results in a build error.

<table width="600px">
  {{#each model.tier1Competencies as |competency|}}
    <tr>
        <td>{{competency.domain}}</td>
        <td>{{competency.number}}</td>
        <td>{{current-course-helper competency.id}}</td>   // Works here
        <td>
            {{course-select
                content = model.tier1Team.tier1Courses
                optionValuePath = "content.id"
                optionLabelPath = "content.name"
                selected = {{current-course-helper competency.id}} // But I need it here
                prompt = "Available Courses..."
            }}
        </td>
    </tr>
  {{/each}}
</table>

Determining the value somewhere else first seems problematic because I need competency.id from the {{#each}} block to determine the value to pass to the component.

Is there some way to pass the result of the Handlebar Helper to the component?

locks locks · Accepted Answer · 2016-01-20T01:47:54

The correct syntax is:

{{course-select
    content = model.tier1Team.tier1Courses
    optionValuePath = "content.id"
    optionLabelPath = "content.name"
    selected = (current-course-helper competency.id)
    prompt = "Available Courses..."
}}

It's called a nested helper, you can see examples of it for example in the concat helper documentation. It can be used with any helper, and you can nest however many times you want!

Passing an Ember Handlebars Helper Result to a Component

1 Answers