페이지 간 링크

Coddy Django 여정의 Django 기초 섹션에 포함된 레슨. 23개 중 16번째.

각 음료에는 /drinks/<slug>/에 페이지가 있으며, /drinks/의 목록은 해당 페이지로 연결되어야 합니다. 템플릿에서 {% url %} 태그는 뷰에서 reverse()가 하는 것처럼 경로 이름을 바탕으로 주소를 만듭니다:

<a href="{% url 'menu:about' %}">About us</a>
<a href="{% url 'menu:table' 7 %}">Table 7</a>

이름이 네임스페이스와 함께 따옴표 안에 먼저 옵니다. 변환기 값은 공백으로 구분해 그 뒤에 오며, 변수일 수도 있습니다. 반복문에서 {% url 'menu:table' table.number %}는 각 테이블의 주소를 만듭니다. 이제 DRINKS의 각 음료에는 고유한 slug가 있습니다.

잘못된 이름이나 값은 NoReverseMatch 오류로 페이지를 중단시키므로, 링크가 잘못되면 방문자가 클릭할 때가 아니라 페이지를 만드는 동안 드러납니다.

챌린지

쉬움

drinks.html에서 각 음료의 이름을 해당 페이지로 연결되는 링크로 만드세요. <a href="...">Latte</a>는 /drinks/latte/로 연결됩니다. {% url %}과 음료의 slug를 사용해 주소를 만드세요.

실행을 누르고 /drinks/에서 Flat White를 클릭하세요.

직접 해보기

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Our Drinks</title>
</head>
<body>
    <h1>Our Drinks</h1>
    <p class="count">{{ drinks|length }} drink{{ drinks|pluralize }}</p>
    <ul>
        {% for drink in drinks %}
            <li class="drink">
                {{ drink.name }}
                <span class="price">${{ drink.price|floatformat:2 }}</span>
                {% if drink.sold_out %}
                    <span class="sold-out">Sold out</span>
                {% endif %}
            </li>
        {% empty %}
            <li>No drinks today.</li>
        {% endfor %}
    </ul>
</body>
</html>