模板引擎语法-变量

文章目录

模板引擎语法-变量

（一）在Django框架模板中使用变量的代码实例

1.创建项目

bash 复制代码

cd E:\Python\
django-admin.exe startproject TmplSite

2.在编程工具中打开此项目。

3.创建应用

bash 复制代码

django-admin.exe startapp gramapp

4.定义应用的视图文件

文件路径【TmplSite/gramapp/views.py】

python 复制代码

from django.http import HttpResponse
from django.shortcuts import render
from django.template import loader


# Create your views here.

def index(request):
    return HttpResponse("Hello, Django! You're at the gramapp index.")

def grammar(request):
    context = {}
    context['title'] = "Django Template Grammar"
    context['gram'] = "grammar"
    template = loader.get_template('gramapp/grammar.html')
    return HttpResponse(template.render(context, request))

【代码分析】

代码	分析
context $'title'$ = "Django Template Grammar	在变量context中添加了第一个属性title，并进行了赋值
context $'gram'$ = "grammar"	在变量context中添加了第二个属性grm，并进行了赋值
template = loader.get_template('gramapp/grammar.html')	调用get_template()函数加载html模板，并保存在模板对象template中
return HttpResponse(template.render(context, request))	通过模板对象template调用了render()函数，将上下文对象context传递到html模板grammar.html中进行渲染

5.定义HTML模板的代码实例

文件路径【gramapp/templates/gramapp/grammar.html】

html 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="/static/css/mystyle.css"/>
    <title>{{ title }}</title>
</head>
<body>

<p class="middle">
    Hello, this is a <b>{{ gram }}</b> page!
</p>

</body>
</html>

【代码分析】

代码	分析
{{ title }}	通过双花括号（{{}}）引用了views.py中定义的第一个属性{{title}}
Hello, this is a {{ gram }} page!	通过双花括号（{{}}）引用了views.py中定义的第二个属性{{gram}}

6.定义路由文件

文件路径【TmplSite/gramapp/urls.py】

python 复制代码

from django.urls import path
from . import views

urlpatterns = [
    path('', views.index, name='index'),
    path('gram/', views.grammar, name='grammar'),
]

文件路径【TmplSite/TmplSite/urls.py】

python 复制代码

from django.contrib import admin
from django.urls import include, path


urlpatterns = [
    path('gramapp/', include('gramapp.urls')),
    path('admin/', admin.site.urls),
]

7.定义项目根目录的settings.py文件

python 复制代码

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'gramapp.apps.GramappConfig',		# 新增应用
]

8.打开FireFox浏览器访问

【http://localhost:8000/gramapp/】

【http://localhost:8000/gramapp/gram/】

（二）在Django框架模板中使用变量对象属性的代码实例

1.编辑视图文件

文件路径【TmplSite/gramapp/views.py】

python 复制代码

from django.http import HttpResponse
from django.shortcuts import render
from django.template import loader


# Create your views here.

def index(request):
    return HttpResponse("Hello, Django! You're at the gramapp index.")

def grammar(request):
    context = {}
    context['title'] = "Django Template Grammar"
    context['gram'] = "grammar"
    context['author'] = {'first_name': 'King', 'last_name': 'Wang'}		# 新增此行
    template = loader.get_template('gramapp/grammar.html')
    return HttpResponse(template.render(context, request))

【代码分析】

代码	分析
context $'author'$ = {'first_name': 'King', 'last_name': 'Wang'}	在变量context中追加了一个属性author，并赋值为一个字典类型

2.编辑HTML模板

文件路径【TmplSite/gramapp/templates/grammar.html】

html 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="/static/css/mystyle.css"/>
    <title>{{ title }}</title>
</head>
<body>

<p>
    Hello, this is a <b>{{ gram }}</b> page!
</p>
<p>
    Author: <b>{{ author.first_name }} {{ author.last_name }}</b>
</p>

</body>
</html>

【代码分析】

代码	分析
Author: {{ author.first_name }} {{ author.last_name }}	通过.引用视图中定义的两个属性

3.打开FireFox浏览器访问

【http://localhost:8000/gramapp/gram/】

（三）在Django框架模板中使用变量显示列表

1.编辑视图文件

文件路径【TmplSite/gramapp/views.py】

python 复制代码

from django.http import HttpResponse
from django.shortcuts import render
from django.template import loader


# Create your views here.

def index(request):
    return HttpResponse("Hello, Django! You're at the gramapp index.")

def grammar(request):
    context = {}
    context['title'] = "Django Template Grammar"
    context['gram'] = "grammar"
    context['author'] = {'first_name': 'King', 'last_name': 'Wang'}
    context['languages'] = ['Python', 'Django', 'Jinja2']	# 新增此行
    template = loader.get_template('gramapp/grammar.html')
    return HttpResponse(template.render(context, request))

【代码分析】

代码	分析
context $'languages'$ = $'Python', 'Django', 'Jinja2'$	在变量context中追加了一个属性languages，并赋值为列表类型

2.编辑HTML模板

文件路径【TmplSite/gramapp/templates/grammar.html】

html 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="/static/css/mystyle.css"/>
    <title>{{ title }}</title>
</head>
<body>

<p>
    Hello, this is a <b>{{ gram }}</b> page!
</p>
<p>
    Author: <b>{{ author.first_name }} {{ author.last_name }}</b>
</p>
<p>
    Languages:<br>
    <ul>
        {% for lang in languages %}
            <li>{{ lang }}</li>
        {% endfor %}
    </ul>
</p>
</body>
</html>

【代码分析】

代码	分析
Languages: * {% for lang in languages %} {{ lang }} {% endfor %}	定义了一个 * 列表元素；通过在模板中嵌套for语句，遍历了Languages属性；通过在元素中插入列表项"{{lang}}",将Languages属性的每一项值显示在页面中

3.打开FireFox浏览器访问

【http://localhost:8000/gramapp/gram/】