Django模板求助：当前col-md-4满10项时生成新col-md-4

要实现每满10个文档项才生成一个新的col-md-4列，可以通过Django模板的循环计数器和分组逻辑处理，以下是对应解决方案：

核心思路 #

借助forloop.counter0（从0开始的循环索引）判断是否累计满10项，满额时创建新列容器；同时确保每个列内仅包含10项，最后不足10项的内容可按需控制是否生成列。

基础实现（含不足10项的列） #

{% for doc in Documento %}
    {% if forloop.counter0|divisibleby:10 %}
        {% if not forloop.first %}
            <!-- 闭合上一列的容器 -->
            </ul>
            </div>
            </div>
        {% endif %}
        <!-- 开启新的col-md-4列 -->
        <div class="col-md-4">
            <div class="single-price" style="border-radius: 8px;">
                <ul class="price-list">
    {% endif %}

    <!-- 渲染单个文档项 -->
    <li class="d-flex align-items-center">
        <a href="{{ doc.documento.url }}" download="" target="_blank" rel="noopener noreferrer">
            <img src="{{ doc.ícono.url }}" alt="" style="width: 40px; margin-right: 10px;">
        </a>
        <span style="text-align: left;">{{ doc.nombre }}</span>
    </li>

    {% if forloop.last %}
        <!-- 闭合最后一列的容器 -->
        </ul>
        </div>
        </div>
    {% endif %}
{% endfor %}

严格版实现（仅显示含10项的列） #

如果要求只有列内恰好有10项时才渲染，可在视图层提前分组，再在模板中过滤：

视图层处理（示例） #

# 假设视图中获取Documento查询集后，按10个一组拆分
document_groups = [Documento[i:i+10] for i in range(0, len(Documento), 10)]
# 将分组后的数据传入模板
context = {'document_groups': document_groups}

模板层代码 #

{% for group in document_groups %}
    {% if group|length == 10 %}
        <div class="col-md-4">
            <div class="single-price" style="border-radius: 8px;">
                <ul class="price-list">
                    {% for doc in group %}
                        <li class="d-flex align-items-center">
                            <a href="{{ doc.documento.url }}" download="" target="_blank" rel="noopener noreferrer">
                                <img src="{{ doc.ícono.url }}" alt="" style="width: 40px; margin-right: 10px;">
                            </a>
                            <span style="text-align: left;">{{ doc.nombre }}</span>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
    {% endif %}
{% endfor %}

代码说明 #

• forloop.counter0|divisibleby:10：判断当前索引是否为10的倍数，触发新列创建
• 视图层分组后过滤长度为10的组，严格满足"仅当前列满10项才显示下一列"的需求
• 替换原代码中的col-lg-4为col-md-4，贴合需求的响应式布局要求

内容的提问来源于stack exchange，提问作者Ronald