Django模板引入第二个HTML模板时出现递归错误

嘿，这个需求太常见了，我之前也碰到过一模一样的场景，Django的模板include标签正好能完美解决你的重复代码问题，下面一步步帮你搞定：

1. 完善你的错误提示模板 #

先把my_app/form_error_messages.html的代码补全，确保它能覆盖所有类型的表单错误（全局非字段错误和单个字段错误）：

<!-- my_app/form_error_messages.html -->
{% if form.non_field_errors or form.errors %}
    <!-- 处理全局非字段错误（比如表单验证的通用错误） -->
    {% if form.non_field_errors %}
    <div class="col-sm-12 alert alert-danger alert-dismissable fade show" role="alert">
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        {% for error in form.non_field_errors %}
            <p class="mb-0">{{ error }}</p>
        {% endfor %}
    </div>
    {% endif %}

    <!-- 处理单个字段的错误 -->
    {% for field in form %}
        {% if field.errors %}
        <div class="col-sm-12 alert alert-danger alert-dismissable fade show" role="alert">
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            <p class="mb-0">{{ field.label }}: {{ field.errors|join:", " }}</p>
        </div>
        {% endif %}
    {% endfor %}
{% endif %}

注：如果用的是Bootstrap 4及以下版本，关闭按钮的类要改成close，并替换内部代码为<span aria-hidden="true">&times;</span>

2. 在目标模板中引入错误提示模板 #

现在你可以在任何需要显示表单错误的地方，用{% include %}标签引入这个模板就行。比如你的登录表单模板login.html：

<form method="post">
    {% csrf_token %}
    <!-- 引入错误提示模板，自动使用当前上下文里的`form`变量 -->
    {% include 'my_app/form_error_messages.html' %}
    
    <!-- 表单字段渲染 -->
    <div class="mb-3">
        {{ form.username.label_tag }}
        {{ form.username }}
    </div>
    <div class="mb-3">
        {{ form.password.label_tag }}
        {{ form.password }}
    </div>
    
    <button type="submit" class="btn btn-primary">登录</button>
</form>

3. 处理多表单场景（可选） #

如果同一个页面有多个表单，你可以通过with参数指定要使用的表单对象，比如页面里有login_form和register_form两个表单：

<!-- 登录表单的错误提示 -->
{% include 'my_app/form_error_messages.html' with form=login_form %}

<!-- 注册表单的错误提示 -->
{% include 'my_app/form_error_messages.html' with form=register_form %}

4. 进阶：全局复用（可选） #

如果你想让所有继承自base模板的页面都自动显示表单错误，可以把include代码放到base模板的合适位置（比如页面顶部或内容块的开头），但要加个判断避免无表单时报错：

<!-- base.html -->
<div class="container">
    {% if form %}
        {% include 'my_app/form_error_messages.html' %}
    {% endif %}
    {% block content %}{% endblock %}
</div>

这样所有继承base的模板，只要视图里传入了form变量，就会自动显示错误提示，不用再手动include了。

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