Django - system szablonów

Django umożliwia oddzielenie języka Python od HTML, python w widokach, a HTML w szablonach. Aby połączyć te dwa elementy, Django polega na funkcji renderowania i języku szablonów Django.

Funkcja renderowania

Ta funkcja przyjmuje trzy parametry -

  • Request - Pierwsza prośba.

  • The path to the template - To jest ścieżka względna do opcji TEMPLATE_DIRS w zmiennych settings.py projektu.

  • Dictionary of parameters- Słownik zawierający wszystkie zmienne potrzebne w szablonie. Tę zmienną można utworzyć lub użyć locals () do przekazania wszystkich lokalnych zmiennych zadeklarowanych w widoku.

Język szablonów Django (DTL)

Silnik szablonów Django oferuje mini język do definiowania warstwy aplikacji widocznej dla użytkownika.

Wyświetlanie zmiennych

Zmienna wygląda następująco: {{zmienna}}. Szablon zastępuje zmienną zmienną przesłaną przez widok w trzecim parametrze funkcji renderowania. Zmieńmy nasz hello.html, aby wyświetlał dzisiejszą datę -

hello.html

<html>
   
   <body>
      Hello World!!!<p>Today is {{today}}</p>
   </body>
   
</html>

Wtedy nasz pogląd zmieni się na -

def hello(request):
   today = datetime.datetime.now().date()
   return render(request, "hello.html", {"today" : today})

Otrzymamy teraz następujące dane wyjściowe po uzyskaniu dostępu do adresu URL / myapp / hello -

Hello World!!!
Today is Sept. 11, 2015

Jak zapewne zauważyłeś, jeśli zmienna nie jest łańcuchem, Django użyje metody __str__ do jej wyświetlenia; i na tej samej zasadzie możesz uzyskać dostęp do atrybutu obiektu, tak jak robisz to w Pythonie. Na przykład: gdybyśmy chcieli wyświetlić rok daty, moja zmienna wyglądałaby tak: {{dzisiaj.rok}}.

Filtry

Pomagają modyfikować zmienne w czasie wyświetlania. Struktura filtrów wygląda następująco: {{var | filtry}}.

Some examples -

  • {{string|truncatewords:80}} - Ten filtr obetnie ciąg, więc zobaczysz tylko pierwsze 80 słów.

  • {{string|lower}} - Konwertuje ciąg na małe litery.

  • {{string|escape|linebreaks}} - Zmienia zawartość ciągu, a następnie konwertuje podziały wierszy na znaczniki.

Możesz także ustawić wartość domyślną dla zmiennej.

Tagi

Tagi umożliwiają wykonywanie następujących operacji: warunek if, pętla for, dziedziczenie szablonów i inne.

Oznacz, jeśli

Podobnie jak w Pythonie możesz użyć if, else i elif w swoim szablonie -

<html>
   <body>
   
      Hello World!!!<p>Today is {{today}}</p>
      We are
      {% if today.day == 1 %}
      
      the first day of month.
      {% elif today.day == 30 %}
      
      the last day of month.
      {% else %}
      
      I don't know.
      {%endif%}
      
   </body>
</html>

W tym nowym szablonie, w zależności od daty dnia, szablon wyrenderuje określoną wartość.

Oznacz dla

Podobnie jak „if”, mamy tag „for”, który działa dokładnie tak, jak w Pythonie. Zmieńmy nasz widok powitania, aby przesłać listę do naszego szablonu -

def hello(request):
   today = datetime.datetime.now().date()
   
   daysOfWeek = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
   return render(request, "hello.html", {"today" : today, "days_of_week" : daysOfWeek})

Szablon do wyświetlenia tej listy za pomocą {{for}} -

<html>
   <body>
      
      Hello World!!!<p>Today is {{today}}</p>
      We are
      {% if today.day == 1 %}
      
      the first day of month.
      {% elif today.day == 30 %}
      
      the last day of month.
      {% else %}
      
      I don't know.
      {%endif%}
      
      <p>
         {% for day in days_of_week %}
         {{day}}
      </p>
		
      {% endfor %}
      
   </body>
</html>

I powinniśmy dostać coś takiego -

Hello World!!!
Today is Sept. 11, 2015
We are I don't know.
Mon
Tue
Wed
Thu
Fri
Sat
Sun

Blokuj i rozszerzaj tagi

System szablonów nie może być kompletny bez dziedziczenia szablonów. Oznacza to, że kiedy projektujesz swoje szablony, powinieneś mieć główny szablon z otworami, które szablon dziecka wypełni zgodnie z jego własnymi potrzebami, tak jak strona może wymagać specjalnego css dla wybranej zakładki.

Zmieńmy szablon hello.html, aby dziedziczył z main_template.html.

main_template.html

<html>
   <head>
      
      <title>
         {% block title %}Page Title{% endblock %}
      </title>
      
   </head>
	
   <body>
   
      {% block content %}
         Body content
      {% endblock %}
      
   </body>
</html>

hello.html

{% extends "main_template.html" %}
{% block title %}My Hello Page{% endblock %}
{% block content %}

Hello World!!!<p>Today is {{today}}</p>
We are
{% if today.day == 1 %}

the first day of month.
{% elif today.day == 30 %}

the last day of month.
{% else %}

I don't know.
{%endif%}

<p>
   {% for day in days_of_week %}
   {{day}}
</p>

{% endfor %}
{% endblock %}

W powyższym przykładzie po wywołaniu / myapp / hello nadal otrzymamy ten sam wynik, co wcześniej, ale teraz polegamy na rozszerzeniach i blokach, aby refaktoryzować nasz kod -

W pliku main_template.html definiujemy bloki za pomocą bloku tagów. Blok tytułowy będzie zawierał tytuł strony, a blok treści - główną treść strony. W home.html używamy extends do dziedziczenia z main_template.html, a następnie wypełniamy zdefiniowany powyżej blok (treść i tytuł).

Tag komentarza

Tag komentarza pomaga definiować komentarze w szablonach, a nie komentarze HTML, nie pojawią się one na stronie HTML. Może być przydatny do dokumentacji lub po prostu komentowania linii kodu.