Шаблон рендеринга Руль в виде текста - PullRequest
Новая
       36

Шаблон рендеринга Руль в виде текста

52 голосов
/ 24 августа 2011

Я создал помощника в Handlebars, чтобы помочь с логикой, но мой шаблон анализирует возвращенный html как текст, а не html.

У меня есть страница с результатами теста, которая отображается после ее завершения: 

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

Для каждого из раундов я использую помощника, чтобы определить, какой шаблон будет отображать результат раунда: 

  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");
    }
  });

Вот шаблон, описывающий правильный раунд (допустим, он вывел шаблон # round-end-correct): 

  <script id="round-end-correct" type="text/x-handlebars-template">
        <div></div>
  </script>

Вот что визуализируется: 

<div></div>

Не как HTML, а как текст. Как мне заставить его фактически отображать HTML как HTML, а не как текст?

Ответы [ 2 ]

148 голосов
/ 24 августа 2011

Я предполагаю, что укрытие в руле работает так же, как в ванильных усах. В этом случае используйте тройные усы, чтобы убрать html, i, e: {{{unescapedhtml}}}, например: 

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

для ссылки см .: http://mustache.github.com/mustache.5.html

19 голосов
/ 01 мая 2012

Ответы Герт-Яна верны, но просто для справки вы также можете установить результат как «безопасный» непосредственно внутри помощника (код из вики handlebars.js) 

Handlebars.registerHelper('foo', function(text, url) { 
  text = Handlebars.Utils.escapeExpression(text);
  url = Handlebars.Utils.escapeExpression(url); 
  var result = '<a href="' + url + '">' + text + '</a>'; 
  return new Handlebars.SafeString(result); 
});

При этом вы можете использовать обычные двойные рули {{}}, и руль не ускользнет от вашего выражения.

...