Как отобразить переменные шаблонного компонента как HTML

Разработка
1

Привет!

Один быстрый вопрос.

У меня есть вот этот код:

<script
  type="text/x-handlebars"
  data-template-name="/connectors/discovery-below/sidebar"
>
{{#if missions}}
        <h2>{{#if userName}}{{i18n (theme-prefix "sidebar.back")}} {{userName}} {{/if}}!</h2>
        <p>Voici vos missions:</p>
        <div class="mission">
            <h3>Миссия дня: {{missions.daily.mission.label}}</h3>
            <p>
                {{missions.daily.mission.description}}
            </p>
        </div>
    {{/if}}
</script>

Всё работает нормально, за исключением того, что моя переменная «description» содержит HTML.

Она не рендерится в моём шаблоне, поэтому на фронтенде отображается «уродливый» HTML-код:arrow_down:

image
image551×532 20.7 KB

Есть ли способ интерпретировать содержимое внутри фигурных скобок {{}} как HTML?

Где можно найти документацию по этому вопросу? В данный момент я методом обратного инжиниринга разбираю существующий код, что не очень удобно.

Заранее спасибо за любые советы!

2

Поскольку Handlebars изначально был разработан для генерации HTML, он экранирует значения, возвращаемые выражением {{expression}}. Если вы не хотите, чтобы Handlebars экранировал значение, используйте «тройную скобку» {{{.
Introduction | Handlebars

3

Есть htmlSafe:

https://api.emberjs.com/ember/release/functions/@ember%2Ftemplate/htmlSafe