Include a partial in Mustache JS

Question

I have an html template in a var template and an object in var obj.
I call my template in Javascript like this.

var html = Mustache.render(template, obj, {
  templateRef: "path/template"
});

If I console.log html, the original template display perfectly, but the partial (templateRef) section is not rendered at all.

In my template, I have a reference to the partial like this:

{{> templateRef}}

I tried to put the partial on the same level (Remove path), include extension (.mustache), etc. But nothing seems to work.

Anyone have an idea what I'm missing?

Answer 1

It doesn't appear that Mustache.js supports specifying a partial by its path:

The object should be keyed by the name of the partial, and its value should be the partial text.

You'll have to retrieve the template's text and provide that to Mustache.render() (e.g., with jQuery):

$.get('path/template.mustache', function (partialTemplate) {

  var html = Mustache.render(template, obj, {
    templateRef: partialTemplate
  });

  // ...

}, 'text');