Django & algolia - 使用 hogan + {% verbatim %} 标签的条件语句

Question

我希望这不是一个太模糊的问题 - 我正在将 Algolia 搜索平台集成到我的一个项目中，以便能够无缝、轻松地搜索 yadda yadda。从本质上讲，我正在为 Algolia 的 #hit-template 元素中寻找业务目录的高级和低位置的混合布局......在逐字中使用 {% if %} 不太奏效......所以很明显我不明白/缺少的东西。我需要编辑某些东西可能纯粹是在javascript中吗？不确定！什么是 {% 逐字 %} ？不确定？！我可以在 type="text/template" 的脚本中混合使用 javascript 和 html 吗？

{% verbatim %}
    <script id="hit-template" type="text/template">
      {% if _highlightResult.is_premium %}
      <div class="card text-center mb-3">
        <div class="crop-height bg-image-card card-header" style="background-image: url('{{ MEDIA_URL }}{{ get_image_url }}'); height: 160px !important;"></div>
        <div class="card-header" style="color: #fff !important; background-color: {{ brand_colour }} !important; font-size: 1.3rem;">
          {{{ _highlightResult.name.value }}}
        </div>
        <div class="card-body">
          <p class="card-text" style="color: {{ business.brand_colour }} !important;"><a href="https://www.google.co.uk/maps/search/{{ google_maps_location }}" style="color: {{ brand_colour }};"><i class="fas fa-map-marker fa-2x" data-fa-transform="down-6"></i></a></p>
          <p class="card-text"><small>{{ get_full_address }}</small></p>
          <p class="card-text p-2">{{ description }}</p>
          <a href="{{ absolute_url }}" class="btn btn-primary" style="background-color: {{ brand_colour }} !important; border-color: {{ brand_colour }} !important; color: #fff;">Visit Website</a>
        </div>
        <div class="card-footer text-muted">
          <small>
            <i class="fas fa-envelope" data-fa-transform="shrink-2"></i> {{ email }}
            <i class="fas fa-phone" data-fa-transform="shrink-2"></i> {{ telephone }}</small></div>
        <div style="display: none;">{{{ _highlightResult.sector.value }}}</div>
      </div>
      {% else %}
      {% endif %}
    </script>
  {% endverbatim %}

Answer 1

{% verbatim %} 强制 Django 不解释模板文件中的 { 和 } 字符，因此 {% if %} 和 {% endif %} 在逐字标记中不起作用。您仍然可以在逐字标记的outside 中使用 Django 模板语法，并且只在您希望 Django 忽略 {} 的地方使用 {% verbatim %}（即在您的 Javascript 语法中）。

当混合使用不同的模板语法时，可能很难用{ 等特殊字符来解决歧义。解释器引擎无法解决您的意图。这里的一种解决方案是使用 Django 将您需要的变量存储到 Javascript 变量中，并与它们一起使用 hogan.js。

<script>
    window.MEDIA_URL = {{ MEDIA_URL }}
    window.image_url = {{ get_image_url }}
</script>
{% if _highlightResult.is_premium %}
{% verbatim %}
    <script id="hit-template" type="text/template">
        // your Hogan.js stuff here, using `window` variables from Django stored as JS variables...
        // Django will no longer interpret `{` and `}`, only Hogan.js will
    </script>
{% endverbatim %}
{% endif %}

我对 Hogan.js 的了解还不够，无法指导您进一步了解细节。