Menu
CoddyTech

Links entre páginas

Parte da seção Fundamentos do Django do Journey de Django da Coddy. Lição 16 de 23.

Cada bebida tem sua página em /drinks/<slug>/, e a lista em /drinks/ deve incluir links para elas. Em um template, a tag {% url %} monta um endereço a partir do nome de uma rota, assim como reverse() faz em uma view:

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

O nome vem primeiro, entre aspas, com seu namespace. Os valores do conversor vêm em seguida, separados por espaços, e podem ser variáveis: em um loop, {% url 'menu:table' table.number %} monta o endereço de cada mesa. Agora, cada bebida em DRINKS tem seu próprio slug.

Um nome ou valor incorreto causa uma falha na página com NoReverseMatch, então um link quebrado aparece enquanto você desenvolve a página, não quando um visitante clica nele.

challenge icon

Desafio

Fácil

Em drinks.html, transforme o nome de cada bebida em um link para sua página: <a href="...">Latte</a> leva a /drinks/latte/. Crie o endereço com {% url %} e o slug da bebida.

Em /drinks/, clique em Flat White: a página de Flat White será aberta.

Experimente você mesmo

<!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>
quiz iconTeste seus conhecimentos

Esta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.

Todas as lições de Fundamentos do Django

Pratique por conta própria: Playground de Django