Python Lernhandbuch

Kapitel 14: Webapplikation mit FastAPI und Jinja2 · Abschnitt 5 von 5

Templates mit Jinja2

templates/base.html (gemeinsamer Rahmen):

html
<!doctype html>
<html lang="de">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>{% block titel %}Kundenverwaltung{% endblock %}</title>
</head>
<body>
  <main>
    {% block inhalt %}{% endblock %}
  </main>
</body>
</html>

templates/kunden.html:

html
{% extends 'base.html' %}

{% block titel %}Kunden{% endblock %}

{% block inhalt %}
<h1>Kunden</h1>

<form method="get" action="/">
  <input type="search" name="q" value="{{ q }}" placeholder="Suchen ...">
  <button type="submit">Suchen</button>
</form>

<table>
  <thead>
    <tr><th>Nr.</th><th>Name</th><th>Stadt</th><th>Umsatz</th></tr>
  </thead>
  <tbody>
    {% for k in kunden %}
    <tr>
      <td>{{ k.id }}</td>
      <td>{{ k.name }}</td>
      <td>{{ k.stadt or '-' }}</td>
      <td>{{ '%.2f'|format(k.umsatz) }}</td>
    </tr>
    {% else %}
    <tr><td colspan="4">Keine Kunden gefunden</td></tr>
    {% endfor %}
  </tbody>
</table>

<h2>Neuer Kunde</h2>
<form method="post" action="/kunden">
  <input name="name" placeholder="Name" required>
  <input name="stadt" placeholder="Stadt">
  <button type="submit">Anlegen</button>
</form>
{% endblock %}
Jinja-Syntax Bedeutung
{{ ausdruck }} Gibt einen Wert aus. Sonderzeichen werden automatisch maskiert (Schutz vor Code-Einschleusung im Browser)
{% for x in liste %} ... {% else %} ... {% endfor %} Schleife. else läuft bei leerer Liste
{% if bedingung %} ... {% elif %} ... {% else %} ... {% endif %} Verzweigung
{% extends 'base.html' %} Diese Seite erweitert einen Rahmen
{% block name %}...{% endblock %} Austauschbarer Bereich im Rahmen
{% include 'teil.html' %} Fügt ein anderes Template ein
{{ wert\|filter }} Filter anwenden, z. B. {{ name\|upper }}, {{ liste\|length }}, {{ x\|round(2) }}, {{ text\|default('-') }}
{{ k.name }} Zugriff auf Dictionary-Schlüssel oder Attribut
{# Kommentar #} Kommentar, erscheint nicht im HTML

Wichtig: {{ ... }} maskiert Inhalte automatisch. Nur Inhalte, denen du vertraust, darfst du mit |safe ungeprüft ausgeben.

Tipp: Bei Python-Beispielen kannst du auf ▶ Ausprobieren klicken, den Code verändern und direkt ausführen.

← Zurück