Question

我使用Timber（twig）和Wordpress和ACF。

我想创建这个结构：

<div class="section" id="section1">
      <div class="slide slide0">
              <div class="image-container" data-type="home" data-currentslide="1" data-maxslides="3"  data-title="DEMO" data-project="Sweater Collection (Hamburg, 2017)">
                  <img src="img/myimage.jpg">
              </div>
      </div>
      <div class="slide slide1">
              <div class="image-container" data-type="project" data-currentslide="2" data-maxslides="3"  data-title="DEMO" data-project="Sweater Collection (Hamburg, 2017)">
                  <img src="img/myimage.jpg">
              </div>
      </div>
      <div class="slide slide2">
              <div class="image-container" data-type="project" data-currentslide="3" data-maxslides="3"  data-title="DEMO" data-project="Sweater Collection (Hamburg, 2017)">
                  <img src="img/myimage.jpg">
              </div>
      </div>
  </div>
  <div class="section" id="section2">
      <div class="slide slide0">
              <div class="image-container" data-type="project" data-currentslide="1" data-maxslides="3"  data-title="DEMO" data-project="Sweater Collection (Hamburg, 2017)">
                  <img src="img/myimage.jpg">
              </div>
      </div>
      <div class="slide slide1">
              <div class="image-container" data-type="project" data-currentslide="2" data-maxslides="3"  data-title="DEMO" data-project="Sweater Collection (Hamburg, 2017)">
                  <img src="img/myimage.jpg">
              </div>
      </div>
      <div class="slide slide2">
              <div class="image-container" data-type="project" data-currentslide="3" data-maxslides="3"  data-title="DEMO" data-project="Sweater Collection (Hamburg, 2017)">
                  <img src="img/myimage.jpg">
              </div>
      </div>
  </div>

但对于data-type属性，我需要为第一部分添加home并将项目添加到另一部分。我尝试使用父循环索引，但这不起作用。

data-type="{% if loop.parent.loop.index0 %}home{% else %}project{% endif %}"

在上下文中：

{% for section in sections %}
            <div class="section" id="section{{ loop.index }}">
                {% for slide in section.get_field('project_imgs') %}
                  <div class="slide slide{{ loop.index0 }}">
                      <div class="image-container" data-type="{% if loop.parent.loop.index0 %}home{% else %}project{% endif %}" data-currentslide="{{ loop.index }}" data-maxslides="{{ section.get_field('project_imgs')|length }}" data-title="{{ section.project_title }}" data-project="{{ section.project_legend }}">
                          <img src="{{site.theme.link}}/assets/img/samples/mac-web.jpg">
                      </div>
                  </div>
                {% endfor %}
            </div>
        {% endfor %}

Answer 1

您需要与“0”进行比较，并在第二个循环索引上执行and：

data-type="{% if loop.parent.loop.index0 == 0 and loop.index0 == 0 %}home{% else %}project{% endif %}"

这是一个展示您关注工作的部分的小说： https://twigfiddle.com/n9ucvn

木材（树枝），循环父母

1 个答案: