Liên kết giữa các trang

Thuộc phần Kiến thức cơ bản về Django trong hành trình Django của Coddy. Bài học 16 trên 23.

Mỗi đồ uống có trang riêng tại /drinks/<slug>/, còn danh sách tại /drinks/ cần liên kết đến các trang đó. Trong một mẫu, thẻ {% url %} tạo địa chỉ từ tên của một tuyến, giống như reverse() trong một view:

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

Tên tuyến đứng trước, đặt trong dấu ngoặc kép và kèm namespace. Các giá trị bộ chuyển đổi theo sau, cách nhau bằng dấu cách, và có thể là biến: trong một vòng lặp, {% url 'menu:table' table.number %} tạo địa chỉ cho từng bàn. Giờ đây, mỗi đồ uống trong DRINKS đều có slug riêng.

Tên hoặc giá trị không đúng sẽ khiến trang gặp lỗi NoReverseMatch, nên bạn sẽ phát hiện liên kết bị hỏng khi dựng trang, chứ không phải lúc khách truy cập nhấp vào liên kết.

Thử thách

Dễ

Trong drinks.html, hãy biến tên mỗi thức uống thành liên kết đến trang của thức uống đó: <a href="...">Latte</a> dẫn đến /drinks/latte/. Tạo địa chỉ bằng {% url %} và slug của thức uống.

Trên /drinks/, nhấp vào Flat White: trang Flat White sẽ mở ra.

Tự làm thử

<!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>