Django模板嵌套for循环无法渲染paydates列表数据的问题求助

阿华AIGC实验室

2026-4-13

我现在有两个列表（如果Django是这么称呼它们的话），结构都是类似[{'id': x, 'string': 'string'}]的格式，其中一个赋值给变量periods，另一个赋值给paydates。

我尝试在HTML页面里用Django模板语言（DTL）循环这两个列表，把对应的数据渲染到页面元素中。我写了嵌套的{% for ... in ... %}循环：外层循环遍历periods列表，这个部分工作正常；但内层遍历paydates列表的循环完全没有显示任何内容，而且也没有抛出任何错误。

页面效果示意图：蓝色日期来自periods列表显示正常，Pay Date下方应显示paydates的日期但为空

图里的蓝色日期是来自periods列表的，显示正常；而paydates列表的日期应该显示在“Pay Date”下方，但现在是空的。

因为页面布局的要求，我不能把这两个循环分开写，现在不确定有什么办法能解决这个问题。

以下是我的代码：

home.html

{% load static %}
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="https://unpkg.com/@tailwindcss/browser@4"></script>
    <link rel="stylesheet" href="{% static 'appmain/style.css' %}" />
    <title>Payslip Data</title>
  </head>
  <body>
    <div class="container mx-auto my-10 border rounded-2xl border-4 border-purple-200 p-10 bg-gray-200 shadow-2xl">
      <h1 class="text-4xl font-bold mb-15 text-center text-purple-400">Home Page - Payslip Data</h1>
      <div class="periods flex flex-wrap gap-30 justify-center">
        {% for period in periods %}
        <a href="" class="hover:scale-110 duration-500">
          <div class="card">
            <div class="cardbody bg-gray-500 text-white text-center p-5">
              <p class="text-2xl">Pay Date</p>
              {% for paydate in paydates %}
              <p class="text-2xl text-blue-700">{{paydate.paydate}}</p>
              {% endfor %}
            </div>
            <div class="cardheader text-center bg-purple-200 p-5 shadow-xl">
              <p class="text-2xl">Period Commencing</p>
              <h2 class="text-blue-700 text-2xl">{{period.period}}</h2>
              <p>15/06/2025 - 28/06/2025</p>
            </div>
          </div>
        </a>
        {% endfor %}
      </div>
    </div>
  </body>
</html>

views.py

from django.shortcuts import render
from django.http import HttpRequest
from django.http import HttpResponse

periods = [
  {'id': 0, 'period': '15/06/2025'},
  {'id': 1, 'period': '29/06/2025'},
  {'id': 2, 'period': '13/07/2025'},
  {'id': 3, 'period': '27/07/2025'},
  {'id': 4, 'period': '10/08/2025'},
  {'id': 5, 'period': '24/08/2025'},
  {'id': 6, 'period': '07/09/2025'},
  {'id': 7, 'period': '21/09/2025'},
  {'id': 8, 'period': '05/10/2025'},
  {'id': 9, 'period': '19/10/2025'},
  {'id': 10, 'period': '02/11/2025'},
  {'id': 11, 'period': '16/11/2025'},
  {'id': 12, 'period': '30/11/2025'},
  {'id': 13, 'period': '14/12/2025'},
  {'id': 14, 'period': '28/12/2025'},
  {'id': 15, 'period': '11/01/2026'},
  {'id': 16, 'period': '25/01/2026'},
  {'id': 17, 'period': '08/02/2026'},
  {'id': 18, 'period': '22/02/2026'},
  {'id': 19, 'period': '08/03/2026'},
  {'id': 20, 'period': '22/03/2026'},
  {'id': 21, 'period': '05/04/2026'},
  {'id': 22, 'period': '19/04/2026'},
  {'id': 23, 'period': '03/05/2026'},
  {'id': 24, 'period': '17/05/2026'},
  {'id': 25, 'period': '31/05/2026'},
  {'id': 26, 'period': '14/06/2026'}
]

paydates = [
  {'id': 0, 'paydate': '02/07/2026'},
  {'id': 1, 'paydate': '02/07/2026'},
  {'id': 2, 'paydate': '02/07/2026'},
  {'id': 3, 'paydate': '02/07/2026'},
  {'id': 4, 'paydate': '02/07/2026'},
  {'id': 5, 'paydate': '02/07/2026'},
  {'id': 6, 'paydate': '02/07/2026'},
  {'id': 7, 'paydate': '02/07/2026'},
  {'id': 8, 'paydate': '02/07/2026'},
  {'id': 9, 'paydate': '02/07/2026'},
  {'id': 10, 'paydate': '02/07/2026'},
  {'id': 11, 'paydate': '02/07/2026'},
  {'id': 12, 'paydate': '02/07/2026'},
  {'id': 13, 'paydate': '02/07/2026'},
  {'id': 14, 'paydate': '02/07/2026'},
  {'id': 15, 'paydate': '02/07/2026'},
  {'id': 16, 'paydate': '02/07/2026'},
  {'id': 17, 'paydate': '02/07/2026'},
  {'id': 18, 'paydate': '02/07/2026'},
  {'id': 19, 'paydate': '02/07/2026'},
  {'id': 20, 'paydate': '02/07/2026'},
  {'id': 21, 'paydate': '02/07/2026'},
  {'id': 22, 'paydate': '02/07/2026'},
  {'id': 23, 'paydate': '02/07/2026'},
  {'id': 24, 'paydate': '02/07/2026'},
  {'id': 26, 'paydate': '02/07/2026'}
]

def main(request):
  return render(request, 'appmain/home.html', {'periods':periods})

def dates(request):
  return render(request, 'appmain/home.html', {'paydates':paydates})

urls.py

from django.contrib import admin
from django.urls import path, include
from . import views

urlpatterns = [
    path('', views.main),
    path('', views.dates)
]

我是Django和编程新手，不知道能不能把这两个列表合并之后再提取对应的数据渲染到正确的位置，希望能有简单的解决办法。

备注：内容来源于stack exchange，提问作者Stipane