Using Handlerbars helpers in backbone.marionette.handlebars

Viewed 2784

I have a web application using backbone.marionette with handlebars templating provided via the extension backbone.marionette.handlebars. This is working well but I want to now add some templateHelpers to help with formatting and I can't seem to get it to work.

I have included template helpers in what I believe is the correct way (see below) but I get and error from require.js saying it "GET .../templates/helpers/foo.js 404 (NotFound)" as soon as the backbone.marionette application starts.

My template looks like this (UPDATED: Thanks Billy Chan)

<div>{{{foo myData}}}</div>

And I have tried two things. Firstly defining a simple helper inside my Marionette.ItemView as so:

...
return Marionette.ItemView.extend({
    template: template,
    templateHelpers: {
        foo: function (someData) { return 'foo and ' + someData; }
    },
...

This didn't work, i.e. I still got the require.js error given in the first paragraph. (Note: I did try without a function argument in case that was the problem but didn't fix it).

The second thing I did was add a simple file .../templates/helpers/foo.js with a require.js define returning an object with a function foo inside it. This gave the same error as before, i.e. missing file. That might be because I need to define this file as a dependency. I would prefer the first method which does not need an external file, but happy to use this method if that is the correct way.

Finally, I noticed this issue on the backbone.marionette.handlebars github. This suggest that templateHelpers work, but might have a problem. Any suggestions on using helpers in this environment would be very much appreciated.

UPDATE

I bit more experimenting shows that if I have {{foo}} or {{{foo}}} then it calls the foo function in Marionette.ItemView.extend but doesn't insert the return of foo. However if I have {{foo myData}} or {{{foo myData}}} then it gives the 404 Not found error listed above. Strange.

Just for completeness I am using

  • backbone 1.0.0
  • backbone.marionette 1.0.4
  • backbone.marionette.handlebars 0.2.0.
1 Answers
Related