English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Système de template Django

 Django peut séparer Python et HTML séparément, le code Python/Les variables entrent dans la vue et le template HTML. Django relie ces deux éléments, en s'appuyant sur la fonction de rendu et le langage de template Django.

Fonction de rendu

Cette fonction a trois paramètres -

Requête - Initialisation de la requêteChemin du template - C'est le chemin relatif à la variable TEMPLATE_DIRS dans le fichier settings.py du projet.Dictionnaire de paramètres - Le dictionnaire contient toutes les variables nécessaires au template. Ces variables peuvent être créées ou utilisées par locals() à travers toutes les variables locales déclarées dans la vue.

Langage de template Django (DTL)

Le moteur de template Django fournit un petit langage pour définir la couche visuelle de l'application pour l'utilisateur.

Affichage des variables

La variable est affichée comme suit : {{variable}}. Le template est remplacé par les variables envoyées par la vue dans la fonction render en tant que troisième paramètre. Laissons-nous changer hello.html pour afficher la date d'aujourd'hui :

hello.html

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
<html> 
    <body>
       Hello World!!!<p>Aujourd'hui est {{today}}</p>
    </body> 
 </html>

Ensuite, notre vue changera en -

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
def hello(request):
    today = datetime.datetime.now().date()
    return render(request, "hello.html", {"today": today})

Maintenant, nous obtenons le résultat suivant en accédant à l'URL /myapp/hello après -

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
Hello World!!!
 Aujourd'hui est sept. 11, 2015

Comme vous l'avez peut-être remarqué, si la variable n'est pas une chaîne de caractères, Django utilise la méthode __str__ pour la montrer ; et suivant le même principe, vous pouvez accéder aux propriétés de l'objet, comme en utilisant Python. Par exemple : si nous voulons afficher l'année de la date, la variable ici est : {{today.year}}.

Filtre

Ils peuvent vous aider à afficher les variables modifiées. La structure du filtre est la suivante : {{var|filters}}.

Un exemple simple -

{{string|truncatewords:80} - Le filtre coupe les chaînes de caractères, donc vous ne voyez que la partie80 caractères.}}

       {{string|lower}} − Convertit les caractères en minuscules            {{string|escape|linebreaks}} − Échappe le contenu de la chaîne de caractères, puis convertit les retours chariot en balises.    

Vous pouvez également définir des variables par défaut.

Balises

Les balises peuvent effectuer les opérations suivantes : condition if, boucle for, inheritance de modèle et plus encore.

Balise if

Comme en Python, vous pouvez utiliser if, else et elif dans les modèles −

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
<html>
    <body>
       Hello World!!!<p>Aujourd'hui est {{today}}</p>
       Nous sommes
       {% if today.day == 1 }%
       le premier jour du mois.
       {% elif today == 30 %}
       le dernier jour du mois.
       {% else %}
       Je ne sais pas.
       {% endif %}
    </body>
 </html>

Dans ce nouveau modèle, en fonction de la date du jour, ce modèle présentera cette valeur.

Balise for

Comme 'if', nous avons la balise 'for', qui est utilisée de la même manière que dans Python. Modifions la liste de vues hello vue envoyée à notre modèle −

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
def hello(request):
    today = datetime.datetime.now().date()
    daysOfWeek = ['Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam', 'Dim']
    return render(request, 'hello.html', {'today' : today, 'days_of_week' : daysOfWeek})

Ce modèle est utilisé pour afficher la liste {{ for }} −

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
<html>
    <body>
       Hello World!!!<p>Aujourd'hui est {{today}}</p>
       Nous sommes
       {% if today.day == 1 }%
       le premier jour du mois.
       {% elif today == 30 %}
       le dernier jour du mois.
       {% else %}
       Je ne sais pas.
       {% endif %}
       <p>
          {% for day in days_of_week %}
          {{day}}
       </p>
 
       {% endfor %}
    </body>
 </html>

Nous devrions obtenir le contenu de sortie suivant −

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
Hello World!!!
 Aujourd'hui est sept. 11, 2015
 Nous sommes, je ne sais pas.
 Lun
 Mar
 Mer
 Jeu
 Ven
 Sam
 Dim

Balises de bloc et d'extension

Le système de modèle est une inheritance de modèle incomplète. Lorsque vous concevez le sens d'un modèle, le sous-modèle remplit un modèle principal selon ses besoins, comme un onglet sélectionné sur une page peut nécessiter une CSS spéciale.

Laissez-nous modifier le modèle hello.html pour hériter de main_template.html.

main_template.html

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
<html>
    <head> 
       <title>
          {% block title %}Page Title{% endblock %}
       </title> 
    </head>
 
    <body> 
       {% block content %}
          Body content
       {% endblock %} 
    </body>
 </html>

hello.html

# Filename : example.py
# Copyright : 2020 By w3codebox
# Author by : fr.oldtoolbag.com
# Date : 2020-08-08
{% extends "main_template.html" %}
 {% block title %}Ma page d'accueil{% endblock %}
 {% block content %}
 Hello World!!!<p>Aujourd'hui est {{today}}</p>
 Nous sommes
 {% if today.day == 1 }%
 le premier jour du mois.
 {% elif today == 30 %}
 le dernier jour du mois.
 {% else %}
 Je ne sais pas.
 {% endif %}
 <p>
    {% for day in days_of_week %}
    {{day}}
 </p>
 {% endfor %}
 {% endblock %}

Dans l'exemple ci-dessus, en appelant /myapp/hello, nous obtenons toujours le même résultat que précédemment, mais maintenant nous dépendons de l'extension et nous n'avons pas besoin de refonte de code-−

Dans main_template.html, nous définissons l'utilisation des balises de bloc. Le bloc en-tête contiendra le titre de la page, et le bloc de contenu contiendra le contenu principal. Dans Home.html, en utilisant l'héritage d'extension de main_template.html, nous utilisons les balises de bloc définies ci-dessus (contenu et titre).

Balises de commentaires

Les balises de commentaires sont utilisées pour définir des commentaires dans les modèles, pas des commentaires HTML, ils ne apparaîtront pas dans la page HTML. Cela peut être un fichier ou simplement une ligne de code commentée.