Accessing the context (or the root object) passed to Handler.js Template

Question

I have a template like so

Handlebars Template

<script id="choose-player-template" type="text/x-handlebars-template">
      <label>Entity Name:</label>
      <input type="text" value="{{entityName}}"></input>
      <ul>
      {{#players }}
        <li><input type="checkbox" {{#if isSelected}}checked{{/if}}/>
            {{name}}
        </li>
      {{/players}}
      </ul>
      <input type="button" onclick="saveSelection()" value="Save Selection" style="width:150px;"></input>
</script>

Javascript

<script type="text/javascript">
    var playersList = {players: [], entityName: "Name1"}; //I pass this to the handlebar template
</script

Lets say that I pass a object playersList to the Template. What syntax should I use to refer to that object inside the Handlebars Template. In short, how to access the root object passed in to Handlebar template.

Edit : I actually sound confusing with the question above, so this edit. Actually, the template is working and displaying properly the list of players in the ul li list. That part is fine. There is an object "playersList that is passed to template and all the players in this object are displayed properly. However, I am changing the state of each players through the checkbox. Now, once the user is done with the changes, he clicks the input button, shown in the last line of template code. This invokes saveSelection() javascript function (not shown in above code). I wan't to pass the this object from the template, to this function.

A-Train A-Train · Accepted Answer · 2014-07-29T15:15:14

Your context is already set to the base when you pass that object in. I don't know of anyway to access the base object when you are inside of a loop. You may want to create a Helper function to handle some of your processing if you can't get it the way you want.

It looks like you want to iterate your players list. You can do {{#each players}} {{this}} {{/each}} if players = ['joe', 'bob', 'jim'].

Accessing the context (or the root object) passed to Handler.js Template

1 Answers