pass a dom level js object to a template function using jsrender

Question

I simply want to pass in a javascript object that is populated by the template to a helper function. I have looked at conversations regarding passing in helper objects to loops but have not found anything that directly addresses the following example.

<script type="text/javascript">
    // an object set by the template
    var SomeObject = {};
    SomeObject.Id=6;
</script>
<script id = "SomeTemplate" type="text/html">
    <div id="somegroup_{{>Id}}" class="main">
        <img id="somegroup_img_{{>Id}}" class="mainImg" src="{{: ~fltrOAMnImgs_hlp(Images, SomeObject)}}"> 
    </div>
</script>

The current above code does not pass SomeObject to the helper func. How could I do this with the new jsrender lib?

Answer 1

If you want to provide access to your SomeObject within the template, you must pass that object in as a helper. There are some different ways to do that, depending on whether you want it available globally to all templates, just to this template, or just for this render() call. See: the $.views.helpers() topic under Register helpers, converters, tags...

For example if you pass it in with the render call, with a name such as "myObject":

myTemplate.render(myData, {myObject: SomeObject});

then you can reference it as in ~myObject:

<img ... src="{{: ~fltrOAMnImgs_hlp(Images, ~myObject)}}">

See also this related answer: Trying to run a function on an array in a, for loop, using jsrender