Handlebars Template rendering template as text

handlebars.js, javascript, mustache, template-engine

Solution

I assume that unescaping in Handlebars works the same as in vanilla Mustache. In that case use triple mustaches to unescape html, i,e: `{{{unescapedhtml}}}`, like:

<script id="quiz-result" type="text/x-handlebars-template">
    {{#each rounds}}
      {{{round_end_result}}}
    {{/each}}
    <div class="clear"></div>

for ref see: http://mustache.github.com/mustache.5.html

Problem

I created a helper in Handlebars to help with logic, but my template parses the returned html as text rather than html. I have a quiz results page that is rendered after the quiz is completed: ``` <script id="quiz-result" type="text/x-handlebars-template"> {{#each rounds}} {{round_end_result}} {{/each}} <div class="clear"></div> </script> ``` For each of the rounds, I use a helper to determine which template to render a round's result: ``` Handlebars.registerHelper("round_end_result", function() { if (this.correct) { var source = ''; if (this.guess == this.correct) { console.log("correct guess"); var source = $("#round-end-correct").html(); } else { var source = $("#round-end-wrong").html(); } var template = Handlebars.compile(source); var context = this; var html = template(context); console.log(html); return html; } else { console.log("tie"); } }); ``` Here is a template that describes a correct round (let's take say it rendered the #round-end-correct template): ``` <script id="round-end-correct" type="text/x-handlebars-template"> <div></div> </script> ``` Here is what gets rendered: ``` <div></div> ``` Not as HTML, but as text. How do I get it to actually render the HTML as HTML, rather than text?

Original source