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 apontar para elas. Em um template, a tag {% url %} cria 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, junto com o namespace. Em seguida vêm os valores do conversor, separados por espaços, e eles podem ser variáveis: em um loop, {% url 'menu:table' table.number %} cria 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ê monta a página, e 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/. Monte o endereço com {% url %} e o slug da bebida.

Pressione Executar e clique em Flat White em /drinks/.

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