ember.js - How to make linkTo dynamic in ember?

Question

<script type="text/x-handlebars" data-template-name="patient">
    <ul class="nav">
    {{#each menuItem in menuItems}}
        <li>{{#linkTo "dashboard.summary" menuItem}}{{menuItem.name}}{{/linkTo}}</li>
    {{/each}}
    </ul>
    {{outlet}}
</script>

In the above code, how do I make linkTo a dynamic link instead of the hardcoded "dashboard.summary"? For example, "dashboard."+menuItem.name.

Answer 1

In the current Ember (1.10 as of this post), helpers now accept both quoted arguments or arguments that will be looked up as attributes in the current context. I believe this was changed in Ember 1.2 ( change log ).

If quoted, the argument will be used as a string:

{{#link-to 'post'}}Posts{{/link-to}}

If not quoted, the argument will be looked up in the current context:

{{#link-to routeName}}Go To '{{routeName}}'{{/link-to}}

This will be a link-to that points to whatever the routeName property currently is set to. This can be updated dynamically.

Here is an example JSBin showing this in action: http://emberjs.jsbin.com/nelafep/1/edit?html,css,js,output