如何在Django模板中为每个卡切换设计

问题描述 投票:0回答:1

如何为for循环中的每个数据在不同的卡设计之间切换。

<div class="col-1-of-3">
    <div class="card">
     ...
    </div>
</div>

<div class="col-1-of-3">
    <div class="card">
     ...
    </div>
</div>

<div class="col-1-of-3">
    <div class="card">
     ...
    </div>
</div>

这三张卡具有不同的设计,当前在为Django模板中的每个循环切换这些卡时遇到麻烦。

{% for cont in data %}
   {% ifequal forloop.counter|divisibleby:"3" True %}

    <div class="col-1-of-3">
        <div class="card">
         ...
        </div>
    </div>

   {% endifequal %}

   {% ifequal forloop.counter|divisibleby:"2" True %}

    <div class="col-1-of-3">
        <div class="card">
         ...
        </div>
    </div>

   {% endifequal %}

   {% ifnotequal forloop.counter|divisibleby:"2" True %}

    <div class="col-1-of-3">
        <div class="card">
         ...
        </div>
    </div>

   {% endifnotequal %}
{% endfor %}

第三张卡的逻辑是错误的。我需要更改此逻辑,以便每个循环需要交替显示每个卡。另一个挑战是3循环后应该关闭该部分,因为连续只允许3张卡片。

<section class="section-tours" id="section-tours">

            {% ifequal forloop.counter|divisibleby:"3" True %}
            {% endifequal %}

            {% ifequal forloop.counter|divisibleby:"2" True %}
            {% endifequal %}

            {% ifequal forloop.counter|divisibleby:"2" True %}
            {% endifequal %}

</section>
django django-templates
1个回答
0
投票

检查下面的代码,并告诉我它是否有帮助,因为我没有测试过。

我已经为前三个值切片了for循环,如果您想重复相同的操作,请更改相同代码的切片。

{% for cont in data|slice:":3" %} #i have sliced it for first three values only
   {% if forloop.first %}

    <div class="col-1-of-3">
        <div class="card">
         ...
        </div>
    </div>

   {% endif %}

   {% ifequal forloop.counter|divisibleby:"2" True %}

    <div class="col-1-of-3">
        <div class="card">
         ...
        </div>
    </div>

   {% endifequal %}

   {% if forloop.last %}

    <div class="col-1-of-3">
        <div class="card">
         ...
        </div>
    </div>

   {% endif %}
{% endfor %}
© www.soinside.com 2019 - 2024. All rights reserved.