Mustache example

Nested functions

HTML

<script src="https://unpkg.com/mustache@4.2.0/mustache.js"></script>
<div id="output"></div>

<script type="text/html" id="template">
   <h1>{{=<% %>=}}  {{nested.awesome}} <%={{ }}=%></h1>
   {{nested.awesome}}
   <br>
   <h1>{{=<% %>=}} {{#nested}}{{awesome}}{{/nested}} <%={{ }}=%></h1>
   {{#nested}}{{awesome}}{{/nested}}
</script>

JavaScript

window.addEventListener("load", () => {
var output = document.getElementById('output');
var template = document.getElementById('template').innerHTML;

  // render string
  var context = {
    nested: {
      awesome: function() {
        return this.more;
      },
      more: 'Deeply awesome'
    },
    more: 'More awesome'
  }
  output.innerHTML = Mustache.render(template, context);


})