Tautan Antarhalaman

Termasuk bagian Dasar-Dasar Django dalam perjalanan Django di Coddy. Pelajaran 16 dari 23.

Setiap minuman memiliki halamannya sendiri di /drinks/<slug>/, dan daftar di /drinks/ harus mengarah ke halaman tersebut. Dalam template, tag {% url %} membuat alamat dari nama route, seperti yang dilakukan reverse() dalam view:

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

Nama ditulis terlebih dahulu, di dalam tanda kutip, beserta namespace-nya. Nilai converter ditulis setelahnya, dipisahkan dengan spasi, dan bisa berupa variabel: dalam perulangan, {% url 'menu:table' table.number %} membuat alamat untuk setiap tabel. Setiap minuman di DRINKS kini memiliki slug sendiri.

Nama atau nilai yang salah akan membuat halaman mengalami error NoReverseMatch, jadi tautan yang rusak akan terlihat saat kamu membuat halaman, bukan saat pengunjung mengekliknya.

Tantangan

Mudah

Di drinks.html, jadikan nama setiap minuman sebagai tautan ke halamannya: <a href="...">Latte</a> mengarah ke /drinks/latte/. Buat alamatnya dengan {% url %} dan slug minuman tersebut.

Tekan Run lalu klik Flat White di /drinks/.

Coba sendiri

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