在 twig 模板的 for 循环内仅渲染一次表单

Question

我有一个 twig 模板来显示音频选项（自动播放和连续播放），如屏幕截图所示：点击查看页面截图

以下是我的 twig 文件中的代码。 {{ audio_options_form}} 使用复选框呈现表单。如果 {{ item.audio }} 为真，我只想显示一次复选框。 请让我知道我应该进行哪些更改：

 <div id="textcontent">
 {% set field = data|slice(2) %}
  {% set field = field|slice(0, -1) %}
<div class="col-md-12">
<div class = "source-box audio">
    {% for item in field %}
     {% if item.audio %}
    {{ audio_options_form }}

      {% if data.play.autoplay == 1 %}
        <audio autoplay controls src= "{{item.audio}}" id = "audio-play">
          Your browser does not support the
          <code>audio</code> element.
        </audio>
      {% elseif data.play.continuousplay == 1 %}
        <audio autoplay controls src= "{{item.audio}}" id = "audio-play" onended="continousPlay('{{data.lastlevel}}')">
          Your browser does not support the
          <code>audio</code> element.
        </audio>
      {% else %}
        <audio controls src= "{{item.audio}}" id = "audio-play">
          Your browser does not support the
          <code>audio</code> element.
        </audio>
      {% endif %}
      <div id="source-controls">
       {# {% if allow_edit == 1 %}
          <a class="edit-text" href="{{ path('heritage_text_manager.editsource', {'sourceid': item.uniqueid}, {'query': {'destination': path('heritage_ui.contentpage', {'textid': textid})}}) }}">{{ 'Edit'|t }}</a>
        {% endif %} #}
        <a class="more use-ajax" data-toggle="modal" data-dialog-type="modal" href="{{ path('heritage_ui.metadata', {'sourceid': item.uniqueid}) }}">{{ 'More'|t }}</a>  
      </div>

    {% endif %}

  {% endfor %}

</div>

Answer 1

使用标志创建第二个循环或使用过滤filter 。

{% set show_audio_form = false %}
{% for item in field %}
    {% if item.audio %}
        {% set show_audio_form = true %}
    {% endif %}
{% endfor %}
{% if show_audio_form %}{{ audio_options_form  }}{% endif %}
{% for item in field %}
    ... display audio ...
{% endfor %}

---

{% if items|filter(v => v.audio|default)| length %}
    {{ audio_options_form }}
{% endif %}
{% for item in items %}
    ... display audio ...
{% endfor %}

演示