Menu
CoddyTech

템플릿 부분

Coddy Django 여정의 JSON API 섹션에 포함된 레슨. 19개 중 14번째.

스크립트가 항상 JSON을 원하는 것은 아닙니다. 작업을 추가한 후 서버에 해당 작업의 완성된 <li>를 요청해 목록에 넣을 수 있습니다. 템플릿은 이미 해당 행을 그리므로 서버에서 이를 재사용해야 합니다.

Django 6.0에는 템플릿 부분이 추가되었습니다. 이는 단독으로도 렌더링할 수 있는 템플릿의 이름이 지정된 일부입니다. {% partialdef name %}과 {% endpartialdef %}로 감싸세요. inline이라는 단어를 함께 사용하면 루프의 각 항목마다 한 번씩 해당 위치에 그려지기도 합니다. 뷰는 템플릿 이름, #, 부분의 이름을 사용해 해당 부분만 렌더링합니다.

{% partialdef cart-total inline %}
    <strong>{{ cart.total }}</strong>
{% endpartialdef %}
return render(request, "shop/cart.html#cart-total", {"cart": cart})

컨텍스트에는 여기서 cart처럼 해당 부분이 읽는 값이 있어야 합니다. 페이지와 부분은 하나의 마크업을 공유하므로 서로 달라질 수 없습니다.

challenge icon

챌린지

중급

새 /tasks/ 페이지의 행 하나만 제공합니다.

  1. tasks/list.html에서 반복문 안의 <li>를 task-row라는 inline 부분 템플릿으로 만들어 /tasks/에서 계속 모든 행을 표시하도록 하세요.
  2. tasks/views.py에 task_row(request, pk)를 추가하세요. task를 전달해 해당 부분 템플릿만 렌더링하거나 Django의 404 페이지를 표시하세요.
  3. tasks/urls.py에 "tasks/<int:pk>/row/" 경로를 이름 task_row로 추가하세요.

/tasks/3/row/를 여세요. 제목 없이 Call the bank (done)만 표시됩니다.

직접 해보기

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>All tasks</title>
</head>
<body>
    <h1>All tasks</h1>
    <ul id="tasks">
        {% for task in tasks %}
            <li id="task-{{ task.id }}">{{ task.title }}{% if task.done %} (done){% endif %}</li>
        {% endfor %}
    </ul>
</body>
</html>
quiz icon실력 점검

이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.

JSON API의 모든 레슨

직접 연습해 보세요: Django 플레이그라운드