CODEWITHSUNDEEP
javascriptember.js
dezman
dezman

Reputation: 19358

Interpret ember templates twice?

I have a template which loops through an array of all my navigation links. But I would like to use the ember linkTo helper for my links.

My template:

<script type="text/x-handlebars" id="_sideNav">
    <div id="sideNav">  
        <ul>
        {{#each model.sideNav}}
        <li>{{link}}
            <a>
                <i {{bindAttr class="iconClass"}}></i><p>{{label}}</p>
            </a>
        </li>
    {{/each}}
    </div>
</script>

My model:

[
    {
        "label": "Overview",
        "iconClass": "icon-overview",
        "link": "{{#linkTo Overview}}Hello{{/linkTo}}"
    }, {
        "label": "Posts",
        "iconClass": "posts",
        "link": "{{#linkTo totalEnergy}}Hello{{/linkTo}}"
    }
]

You can see I have put linkTo helpers in my model, which doesn't really make sense, and of course I get the text "{{#linkTo totalEnergy}}Hello{{/linkTo}}" appearing on my page.

But I think you can see what I am trying to get at here, and I think it would be really helpful to be able to use templates to generate other templates. My actual navigation has 12+ links which change based on server data and what is relevant on the page.

I feel like I could hack this to make it work, by not initializing the ember app until some handlebars templates have been run, but Im wondering if anyone has a better idea.

Thanks

Upvotes: 0

Views: 102

Answers (2)

Marcio Junior
Marcio Junior

Reputation: 19128

I think that is more simple return a metadata about your links, like: 

App.MenuController = Ember.ArrayController.create({
    content: [
        {"route": "student", "title": "Student Info Page"}, 
        {"route": "payments", "title": "Payments and Pricing"}, 
        {"route": "policy", "title": "Mine"}, 
        {"route": "biography", "title": "About Me"}
    ]
});

And then set in your templates using: 

{{#each routeObject in App.MenuController}}
    {{#linkTo routeObject.route}}{{routeObject.title}}{{/linkTo}}
{{/each}}

But to enable the binding of the linkTo to some object. Is needed to set:

Ember.ENV = {
    HELPER_PARAM_LOOKUPS: true
}

Upvotes: 1

Chris
Chris

Reputation: 323

You could make another template for links and use the 'render' helper to pass along the model for each link

Upvotes: 0

Related Questions