Django - Sistem Template

Django memungkinkan untuk memisahkan python dan HTML, python masuk ke tampilan dan HTML masuk ke templat. Untuk menghubungkan keduanya, Django mengandalkan pada fungsi render dan bahasa Templat Django.

Fungsi Render

Fungsi ini membutuhkan tiga parameter -

  • Request - Permintaan awal.

  • The path to the template - Ini adalah jalur relatif terhadap opsi TEMPLATE_DIRS di proyek settings.py variabel.

  • Dictionary of parameters- Kamus yang berisi semua variabel yang dibutuhkan dalam template. Variabel ini bisa dibuat atau Anda bisa menggunakan lokal () untuk meneruskan semua variabel lokal yang dideklarasikan dalam tampilan.

Bahasa Templat Django (DTL)

Mesin cetakan Django menawarkan bahasa mini untuk mendefinisikan lapisan yang menghadap pengguna dari aplikasi.

Menampilkan Variabel

Variabel terlihat seperti ini: {{variable}}. Template menggantikan variabel dengan variabel yang dikirim oleh tampilan di parameter ketiga dari fungsi render. Mari kita ubah hello.html kita untuk menampilkan tanggal hari ini -

hello.html

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

Kemudian pandangan kita akan berubah menjadi -

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

Sekarang kita akan mendapatkan output berikut setelah mengakses URL / myapp / hello -

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

Seperti yang mungkin Anda perhatikan, jika variabel bukan sebuah string, Django akan menggunakan metode __str__ untuk menampilkannya; dan dengan prinsip yang sama Anda dapat mengakses atribut objek seperti yang Anda lakukan dengan Python. Contoh: jika kita ingin menampilkan tanggal tahun, variabel saya adalah: {{today.year}}.

Filter

Mereka membantu Anda memodifikasi variabel pada waktu tampilan. Struktur filter terlihat seperti berikut: {{var | filter}}.

Some examples -

  • {{string|truncatewords:80}} - Filter ini akan memotong string, jadi Anda hanya akan melihat 80 kata pertama.

  • {{string|lower}} - Mengubah string menjadi huruf kecil.

  • {{string|escape|linebreaks}} - Meloloskan diri dari konten string, lalu mengubah jeda baris menjadi tag.

Anda juga dapat menyetel default untuk variabel.

Tag

Tag memungkinkan Anda melakukan operasi berikut: if condition, for loop, template inheritance, dan lainnya.

Beri tag jika

Sama seperti di Python, Anda dapat menggunakan if, else dan elif di template Anda -

<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>

Dalam template baru ini, bergantung pada tanggal hari, template akan memberikan nilai tertentu.

Tag untuk

Sama seperti 'if', kami memiliki tag 'for', yang berfungsi persis seperti di Python. Mari kita ubah tampilan halo kita untuk mengirimkan daftar ke template kita -

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})

Template untuk menampilkan daftar itu menggunakan {{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>

Dan kita harus mendapatkan sesuatu seperti -

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

Blokir dan Perpanjang Tag

Sistem template tidak dapat diselesaikan tanpa pewarisan template. Artinya ketika Anda mendesain template Anda, Anda harus memiliki template utama dengan lubang yang akan diisi oleh template anak sesuai dengan kebutuhannya sendiri, seperti halaman mungkin memerlukan css khusus untuk tab yang dipilih.

Mari kita ubah template hello.html menjadi warisan dari 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 %}

Dalam contoh di atas, saat memanggil / myapp / hello kita masih akan mendapatkan hasil yang sama seperti sebelumnya tetapi sekarang kita mengandalkan extends dan block untuk merefaktor kode kita -

Di main_template.html kita mendefinisikan blok menggunakan blok tag. Blok judul akan berisi judul halaman dan blok konten akan memiliki konten utama halaman. Di home.html kita menggunakan extends untuk mewarisi dari main_template.html lalu kita isi blok yang ditentukan di atas (konten dan judul).

Tag Komentar

Tag komentar membantu untuk mendefinisikan komentar ke dalam template, bukan komentar HTML, mereka tidak akan muncul di halaman HTML. Ini dapat berguna untuk dokumentasi atau hanya mengomentari sebaris kode.