External handlebars templates backbone marionette

marionette

Solution

I assume you're running v0.9 of Marionette since you mention the Marionette.Async plugin.

The `Renderer` change is slightly off in the method name, and nothing is calling your `TemplateCache` object anymore.

If you're intending to use pre-compiled Handlebars functions, then you only need to do this:

Backbone.Marionette.Renderer.render = function(template, data){
  return template(data);
};

If you intend to have the template loaded asynchronously and then compiled, using the TemplateLoader, your code would need to look like this:

Backbone.Marionette.TemplateCache.prototype.loadTemplate = function (templateId, callback) {
    var tmpId = templateId.replace("#", ""),
        url = "/app/templates/" + tmpId + ".html";

    $.get(url, function (templateHtml) {
        compiledTemplate = Handlebars.compile($(templateHtml).html())
        callback.call(this, compiledTemplate);
    });
};

Backbone.Marionette.Renderer.renderTemplate = function (templateId, data) {
    var renderer = $.Deferred();
    Backbone.Marionette.TemplateCache.get(templateId, function(template){
      var html = template(data);
      renderer.resolve(html);
    });
    return renderer.promise();
};

The Renderer is responsible for calling the TemplateCache.

Side note: what article / blog post / wiki page / documentation were you using to get your code from? I have probably missed some pages that need to be updated.

Problem

In my application i added Marionette.sync plugin and override these methods: ``` Backbone.Marionette.TemplateCache.prototype.loadTemplate = function (templateId, callback) { var tmpId = templateId.replace("#", ""), url = "/app/templates/" + tmpId + ".html"; $.get(url, function (templateHtml) { compiledTemplate = Handlebars.compile($(templateHtml).html()) callback.call(this, compiledTemplate); }); }; Backbone.Marionette.Renderer.renderTemplate = function (template, data) { template(data); }; ``` But this not work, any ideas?

Original source