I recently needed to move to using a JST file for all my templates so I don't have a clutter of html templates everywhere.
I am building the JST file with grunt (using grunt-contrib-jst) and it creates the file "build/templates.js".
Below is an entry from there:
this["JST"] = this["JST"] || {};
this["JST"]["build/html/template-1.html"] = function(obj) {obj || (obj = {});var __t, __p = '', __e = _.escape;with (obj) {__p += ' <script type="text/template" id="template-1">\n <span id="chat_title_1">' +((__t = ( title )) == null ? '' : __t) +'</span>\n <span id="chat_symbol_1">▲</span>\n </script>';}return __p};
I updated my backbone.marionette render method as per https://github.com/marionettejs/backbone.marionette/wiki/Using-jst-templates-with-marionette, where it asks to replace the Renderer.render method. See the change below:
Marionette.Renderer = {
render: function(template, data){
if (!JST[template]) throw "Template '" + template + "' not found!";
return JST[template](data);
}
};
So I have the following in my view:
App.ChatBoxView = Backbone.Marionette.Layout.extend({
template: "build/html/template-1.html",
...
The page loads, there are no errors or anything, but there is nothing rendering on the page, no views, etc.
Is there something missing or done wrong?
Thank you.
Solved it... my template html files still had the <script ....>
at the start and end. Removing that worked.
Updated entry example in "templates.js":
this["JST"] = this["JST"] || {};
this["JST"]["build/html/template-1.html"] = function(obj) {obj || (obj = {});var __t, __p = '', __e = _.escape;with (obj) {__p += '<span id="chat_title_1">' +((__t = ( title )) == null ? '' : __t) +'</span>\n <span id="chat_symbol_1">▲</span>';}return __p};