Template Acquisition

Raw Text

Raw text can be templated by passing an object with a text attribute containing your template and Mustache will return a document fragment back. For example:

var template = "My body lies over the {{.}}";
var fragment = new can.mustache({ text: template })
                .render('water');
can.append(can.$(document.body), can.view.frag(fragment));

Script Tags

Inline script tags in your HTML document can be used to render templates. Set the type to text/mustache and the id as a unique key Mustache will use for look up.

<script id="mytemplate" type="text/mustache">
    My body lies over the {{.}}
</script>

var template = can.view("#mytemplate", 'water');
can.$(document.body).append(template);

URL

Templates can be defined in their own files and Mustache will fetch the files on render. This is the preferred way since it will keep your application nicely organized seperating views from logic code.

var template = can.view('//lib/views/mytemplate.mustache', 
                dataToPass);
can.$(document.body).append(template);

Since this could potentially make several XHR requests, in a big application this could be a performance concern. Creating a build step to concatenate and include all of the views in one file would be one way to optimize performance. If you are using Steal, it will do this automatically at build for you.