Python Academy · Pelajaran

Templat dengan Jinja2

Paparkan HTML dinamik

Pelajaran 2 daripada 413 langkah

Templat dengan Jinja2 ialah pelajaran Python Academy percuma di CoddyKit. Ini ialah pelajaran 2 daripada 4. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Python Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Python Academy merangkumi sejumlah 4 pelajaran.

Mengapa Templat

Mengembalikan HTML daripada rentetan Python cepat menjadi berserabut. Templat menyimpan HTML anda dalam fail berasingan dan mengisikan data semasa pemaparan. Flask menggunakan enjin Jinja2.

from flask import Flask, render_template
app = Flask(__name__)
# render_template loads a file from the templates/ folder
print('Jinja2 powers Flask templates')

Folder templates

Flask mencari templat dalam folder bernama templates/ yang terletak di sebelah aplikasi anda. Fail biasanya berakhir dengan .html.

# project/
#   app.py
#   templates/
#     index.html
print('Templates live in templates/')

render_template

render_template('index.html') memuatkan templat dan mengembalikan HTML yang telah dipaparkan sebagai respons.

from flask import Flask, render_template
app = Flask(__name__)

@app.route('/')
def home():
    return render_template('index.html')
print('home renders index.html')

Menghantar Data

Hantarkan pemboleh ubah sebagai argumen kata kunci. Templat kemudiannya boleh memaparkan pemboleh ubah tersebut.

from flask import Flask, render_template
app = Flask(__name__)

@app.route('/')
def home():
    return render_template('index.html', name='Alice')
print('name=Alice is sent to the template')

Memaparkan Pemboleh Ubah

Dalam templat, {{ name }} mencetak nilai pemboleh ubah. Pendakap berganda itu ialah sintaks ungkapan Jinja2.

# index.html
# <h1>Hello, {{ name }}!</h1>
print('Double braces output a value')

Pernyataan Bersyarat

Pernyataan kawalan Jinja2 menggunakan {% %}. Blok if memaparkan kandungan berdasarkan syarat.

# {% if user %}
#   <p>Welcome back!</p>
# {% else %}
#   <p>Please log in.</p>
# {% endif %}
print('{% if %} branches the markup')

Gelung Ulangan

Ulang melalui senarai dengan {% for item in items %} untuk memaparkan penanda berulang, seperti senarai produk.

# <ul>
# {% for item in items %}
#   <li>{{ item }}</li>
# {% endfor %}
# </ul>
print('{% for %} repeats markup per item')

Penapis

Penapis mengubah nilai menggunakan tanda paip: {{ name|upper }} menukarnya kepada huruf besar. Penapis terbina dalam termasuk length, default dan title.

# {{ name|upper }}        -> ALICE
# {{ items|length }}      -> count
# {{ bio|default('N/A') }}
print('Filters transform values with |')

Pewarisan Templat

Templat asas mentakrifkan rangka halaman dengan ruang letak {% block %}. Templat anak menggunakan {% extends %} untuk mewarisinya dan mengisi blok tersebut.

# base.html
# <body>{% block content %}{% endblock %}</body>
#
# page.html
# {% extends 'base.html' %}
# {% block content %}<p>Hi</p>{% endblock %}
print('extends + block share a layout')

Pelolosan Automatik

Jinja2 meloloskan HTML dalam pemboleh ubah secara automatik untuk melindungi daripada skrip silang tapak. Nilai seperti <script> dipaparkan sebagai teks, bukannya dilaksanakan.

# If name = '<b>x</b>', {{ name }} renders the literal text
# Auto-escaping is on by default for safety
print('Auto-escaping prevents XSS')

Pautan dengan url_for

Dalam templat, anda masih boleh memanggil url_for, biasanya untuk fail statik: {{ url_for('static', filename='style.css') }}.

# <link rel='stylesheet'
#   href="{{ url_for('static', filename='style.css') }}">
print('url_for works inside templates too')

Ujian Ringkas

Uji pengetahuan anda tentang Jinja2.

Jawab dalam pelajaran interaktif

Rumusan

Anda telah mempelajari penggunaan templat Jinja2.

render_template() memaparkan fail daripada templates/
{{ }} memaparkan nilai; {% %} menjalankan if/for
Penapis seperti |upper mengubah nilai
extends + block membolehkan pewarisan reka letak
Pelolosan automatik melindungi daripada XSS

Percuma untuk bermula

Pelajari Python dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus: 76
Pelajaran: 320

Mula belajar secara percuma Lihat kursus penuh

Soalan Lazim

Adakah pelajaran “Templat dengan Jinja2” percuma?

Ya — teks penuh “Templat dengan Jinja2” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus Python Academy, tingkat taraf kepada CoddyKit PRO. Kursus Python Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Templat dengan Jinja2”?

Paparkan HTML dinamik Anda berlatih Python Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Python Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Python Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 2 daripada 4.

Berapa lamakah pelajaran “Templat dengan Jinja2” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Python Academy ini?

Ya. Setiap pelajaran Python Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

← Kembali ke Python Academy