Skip to content

Instantly share code, notes, and snippets.

@mdix

mdix/exampleTemplate.mustache.js

Last active December 16, 2015 03:29
Show Gist options
  • Save mdix/5370433 to your computer and use it in GitHub Desktop.
Save mdix/5370433 to your computer and use it in GitHub Desktop.
Download ZIP
Using mustache templates without loading them via XHR
Raw
exampleTemplate.mustache.js
// header for all templates, so you don't have to worry about the include order
appNamespace = appNamespace || {};
appNamespace.templates = appNamespace.templates || {};
// template definition
appNamespace.templates.exampleTemplate = [
'{{#logo}}<div class="logo"></div>{{/logo}}',
'<div class="shareIconSet">',
'{{#share.facebook}}<div class="facebook"></div>{{/share.facebook}}',
'{{#share.twitter}}<div class="twitter"></div>{{/share.twitter}}',
'</div>',
'{{#getInTouch}}<div class="getInTouch"></div>{{/getInTouch}}'
].join('\n');
Raw
exampleTemplateTwo.mustache.js
// header for all templates, so you don't have to worry about the include order
appNamespace = appNamespace || {};
appNamespace.templates = appNamespace.templates || {};
// template definition
appNamespace.templates.exampleTemplateTwo = [
'{{#logo}}<div class="logo"></div>{{/logo}}',
'<div class="shareIconSet">',
'{{#share.facebook}}<div class="facebook"></div>{{/share.facebook}}',
'{{#share.twitter}}<div class="twitter"></div>{{/share.twitter}}',
'</div>',
'{{#getInTouch}}<div class="getInTouch"></div>{{/getInTouch}}'
].join('\n');
Raw
index.html
<!DOCTYPE html>
<head>
</head>
<body>
<!-- mustache lib -->
<script src="js/vendor/mustache.min.js"></script>
<!-- mustache templates -->
<script src="data/templates/exampleTemplate.mustache.js"></script>
<script src="data/templates/exampleTemplateTwo.mustache.js"></script>
<script>
// render templates
Mustache.render(appNamespace.templates.exampleTemplate);
Mustache.render(appNamespace.templates.exampleTemplateTwo);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment