Django父模板无法渲染{% block %}区块内容求助

Key Problems Identified #

• VS Code Live Server can’t process Django template syntax: Directly opening layout.html or linesofoperation.html skips Django’s {% extends %} and {% block %} tags. The parent template shows only base content, while the child works in isolation because the browser ignores template tags and renders raw HTML/flexbox.
• Conflicting URL patterns: Your app’s urls.py has two entries for the empty path (""), so only the first view (leadership) is ever used—RadioButtonForm is unreachable.
• Unnecessary parent template view: You don’t need a view for layout.html; Django renders child templates that extend the parent automatically.

Step-by-Step Fixes #

1. Remove the Unnecessary Layout View

Edit views.py to delete the layout function—never render the parent template directly:

def leadership(request):
    return render(request, "Resilience_Radar_App/leadership.html")

def linesofoperation(request):
    return render(request, "Resilience_Radar_App/linesofoperation.html")

# Delete this line: def layout(request): ...

2. Fix Conflicting URL Patterns

Update your app’s urls.py to assign unique paths to each view:

from django.urls import path
from . import views

urlpatterns = [
    path("", views.leadership, name="leadership"),
    path("radio-button-form/", views.RadioButtonForm, name="RBF"),  # Unique path added
    path("linesofoperation/", views.linesofoperation, name="LoO")
]

3. Use Django’s Development Server (Not Live Server)

Django’s template engine only processes tags when running the official server. Execute this command in your project root:

python manage.py runserver

Navigate to your child template’s URL to see the fully rendered layout:

• Lines of Operation page: http://localhost:8000/Resilience_Radar_App/linesofoperation/

4. Verify Template Inheritance Path

Ensure your child template correctly references the parent. Since both templates are in the same directory, the existing {% extends "layout.html" %} works. For safety, you can use the full app-specific path:

{% extends "Resilience_Radar_App/layout.html" %}

5. Fix Static File References (Optional but Critical)

If flexbox styles aren’t loading, set up Django static files properly:

• Move styles.css to /Resilience_Radar/Resilience_Radar_App/static/Resilience_Radar_App/
• Update layout.html to load static files:

<!DOCTYPE html>
<html lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1">
{% load static %}
<head>
  <link rel="stylesheet" href="{% static 'Resilience_Radar_App/styles.css' %}">
  <title>Resilience</title>
</head>
<body>
<h1>Risk Resilience</h1>
{% block linesofoperation %}
{% endblock %}
</body>
</html>

How It Works #

When you render a child template via Django’s server:

• The {% extends %} tag tells Django to use layout.html as the base.
• Content from the child’s {% block linesofoperation %} replaces the empty block in the parent.
• The server processes all template syntax and sends a fully rendered HTML page to the browser, combining your flexbox content with the parent template’s layout.

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