Django模板避免重复代码：适配不同for循环场景的最佳实践

Django模板在渲染前会先完成语法解析，要求所有标签的闭合都在同一个作用域内，跨块开启/闭合for循环的写法在解析阶段就会触发语法错误，无法正常运行。以下是两种可行的实现方案：

推荐方案：抽离卡片片段使用include引入 #

这是Django模板体系下复用重复组件的标准实现，灵活性和可维护性最高：

1. 抽离独立的文章卡片模板
   新建_article_card.html文件，把单篇文章的渲染代码全部放在这个文件中：

{% load static %}
<div class="col-xs-12 col-sm-4">
    <div class="card">
        <a class="img-card">
            <img class="img-fluid" src="{% static post.featured_image %}" />
        </a>
        <!-- 其余卡片逻辑，比如标题、摘要、发布时间等 -->
    </div>
</div>

2. 各页面按需循环调用
   所有需要展示文章列表的页面，自行定义循环逻辑和使用的数据集，引入上述模板片段即可：

• 首页展示最新文章

<div class="row">
{% for post in recent_articles %}
    {% include '_article_card.html' %}
{% endfor %}
</div>

• 分类页展示对应分类的文章

<div class="row">
{% for post in category_posts %}
    {% include '_article_card.html' %}
{% endfor %}
</div>

• 搜索结果页展示匹配结果

<div class="row">
{% for post in search_result %}
    {% include '_article_card.html' %}
{% endfor %}
</div>

该方案优势：

• 完全不需要统一各视图的传参变量名，扩展性强，单个页面也可以同时展示多个不同的文章列表
• 卡片逻辑仅维护一份，修改时不需要调整多个页面的代码
• 语法完全符合Django模板的规范，不会出现解析错误

备选方案：模板继承+统一迭代变量 #

如果你的场景下所有文章列表的容器结构完全一致，也可以选择在父模板中写死循环逻辑，约定统一的迭代变量名：
父模板article_list.html代码：

{% load static %}
<div class="row">
{% for post in article_list %}
    <div class="col-xs-12 col-sm-4">
        <div class="card">
            <a class="img-card">
                <img class="img-fluid" src="{% static post.featured_image %}" />
            </a>
            <!-- 其余卡片逻辑 -->
        </div>
    </div>
{% endfor %}
</div>

各个视图在返回模板时，把要渲染的文章数据集赋值给article_list变量即可：

# 首页视图示例
def index(request):
    recent_articles = Article.objects.all().order_by('-create_time')[:10]
    return render(request, 'index.html', {'article_list': recent_articles})

# 分类页视图示例
def category(request, category_id):
    category_posts = Article.objects.filter(category_id=category_id)
    return render(request, 'category.html', {'article_list': category_posts})

该方案优势是子模板不需要写任何重复代码，劣势是单个页面如果需要展示多个不同的文章列表时无法支持。

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