如何使用Django将views.py中的数据有效传递至前端HTML页面?

2026-05-28 21:551阅读0评论SEO基础
  • 内容介绍
  • 文章标签
  • 相关推荐

本文共计988个文字,预计阅读时间需要4分钟。

如何使用Django将views.py中的数据有效传递至前端HTML页面?

自学Django已有一周,记录自学过程中的每一步,为初学者提供参考。本次重点:通过实例展示views.py中的数据如何传递到HTML页面。

自学Django已经有一周啦,想把自己自学过程中的每一步都记录下来,给一些零基自学Django的战友们一些参考;本次主要内容为,用一个实例展现views.py中的数据是如何传递到html页面,并在页面中展示。

我的项目已经创建好,我的app为song03apptest。因为我的项目和环境的相关配置已经配置好,如果是第一天开始学习Django的童鞋,请先看我的入门教程,第一个Django实例。

本文重点在于用实例来说明views和html前台页面的传递。

1.打开我的app,song03apptest下的views.py编写views.py文件,代码如下:

from django.shortcuts import render # Create your views here. def year(request): years = range(1997, 2018) return render(request, 'year_test.html', {"data":years})

2.配置urls.py,其中song03apptest为我的app名称代码如下:

from django.urls import path from song03apptest import views urlpatterns = [ path('testyear/', views.year), ]

3.在templates下创建year_test.html,编写页面,内容如下:

如何使用Django将views.py中的数据有效传递至前端HTML页面?

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <label for="byear">出生年月</label> <select name="byear"> {% for year111 in data %} <option value="{{ year111}}">{{ year111 }}</option> {% endfor %} </select> </body> </html>

4.运行服务器,并在浏览器中输入127.0.0.1:8000/app03/testyear/,页面展示如下:

点击后可见在views.py中使用years = range(1997, 2018)生成的列表,页面效果如下:

补充知识:Django views.py 和 html 之间参数传递关系

Django中的View部分,就是如何用代码来与models中定义的字段进行交互。与传统MVC分层定义略有不同的是,在Django中,View的功能是对页面请求进行响应和逻辑控制,而页面内容的表示则由Django的Template模板来完成。我们可以把Django的View理解为实现各种功能的Python函数,View负责接受URL配置文件urls.py中定义的URL转发并响应处理,当Django收到请求之后调用相应的View函数来完成功能,article模块中的views.py文件代码定义如下:

views.py代码定义

from django.shortcuts import render_to_response from news.article.models import List def news_report(request): article_listing = [] for article_list in List.objects.all(): article_dict = {} article_dict[&apos;news_object&apos;] = article_list article_dict[&apos;item_count&apos;] = article_list.item_set.count() article_dict[&apos;items_title&apos;] = article_list.title article_dict[&apos;items_complete&apos;] = article_list.item_set.filter(completed=True).count() article_dict[&apos;percent_complete&apos;] = int(float(article_dict[&apos;items_complete&apos;]) / article_dict[&apos;item_count&apos;] * 100) article_listing.append(article_dict) return render_to_response(&apos;news_report.html&apos;, { &apos;article_listing&apos;: article_listing })

这是一段简洁的Python代码,让我们看看在这段代码里面Django的函数做了哪些工作吧:

List.objects.all方法返回news列表中所有的记录项,Django可以根据后台数据库转换成相应的SQL语句,在后台数据库中执行并返回查询结果。

每一条article文章都有item_set属性,代表news新闻条目中的每一个item项。如果需要设置查询条件,也可以使用item_set.filter方法来返回符合特定要求的item项。

render_to_response函数返回浏览器指定的HTML页面,页面为Django的Template模板,负责展示被请求的页面内容。

在view部分的代码中,已经指定了页面显示模板为news_report.html。其实,在Django工程中创建模板是一件非常方便的事情,下面要在article目录内创建这个模板页面,首先新建一个名为templates的文件夹,然后在这个模板目录里创建所需的news_report.html模板文件,模板的代码如下:

news_report模板代码

< html> < head> < meta 127.0.0.1:8000/report/,将会看到新闻列表的返回界面。页面中显示了数据库中已添加所有新闻的分类统计信息。值得一提的是,Django模板支持多层嵌套,并且每一层都可以使用DIV+CSS方式完成布局,可以方便的让站点页面遵循统一风格,看起来美观大方。

在上述整个过程中,对使用Django进行Web开发进行了初步的介绍。在应用中写的Python代码不过几十行,比较起来其他的开发语言,Django显得非常便捷实用,最后再来回顾一下Django都帮助我们做了哪些工作吧:

通过Django的对象关系映射模型建立了存储新闻分类以及新闻项的两张数据表,并用syncdb命令同步更新到数据库。

借助Django的管理功能在应用中生成了一个漂亮实用的后台管理界面。

利用Django函数和标签编写了view功能模块以及显示数据结果的Template模板。

以上这篇Django实现将views.py中的数据传递到前端html页面,并展示就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持易盾网络。

标签:数据传递

本文共计988个文字,预计阅读时间需要4分钟。

如何使用Django将views.py中的数据有效传递至前端HTML页面?

自学Django已有一周,记录自学过程中的每一步,为初学者提供参考。本次重点:通过实例展示views.py中的数据如何传递到HTML页面。

自学Django已经有一周啦,想把自己自学过程中的每一步都记录下来,给一些零基自学Django的战友们一些参考;本次主要内容为,用一个实例展现views.py中的数据是如何传递到html页面,并在页面中展示。

我的项目已经创建好,我的app为song03apptest。因为我的项目和环境的相关配置已经配置好,如果是第一天开始学习Django的童鞋,请先看我的入门教程,第一个Django实例。

本文重点在于用实例来说明views和html前台页面的传递。

1.打开我的app,song03apptest下的views.py编写views.py文件,代码如下:

from django.shortcuts import render # Create your views here. def year(request): years = range(1997, 2018) return render(request, 'year_test.html', {"data":years})

2.配置urls.py,其中song03apptest为我的app名称代码如下:

from django.urls import path from song03apptest import views urlpatterns = [ path('testyear/', views.year), ]

3.在templates下创建year_test.html,编写页面,内容如下:

如何使用Django将views.py中的数据有效传递至前端HTML页面?

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <label for="byear">出生年月</label> <select name="byear"> {% for year111 in data %} <option value="{{ year111}}">{{ year111 }}</option> {% endfor %} </select> </body> </html>

4.运行服务器,并在浏览器中输入127.0.0.1:8000/app03/testyear/,页面展示如下:

点击后可见在views.py中使用years = range(1997, 2018)生成的列表,页面效果如下:

补充知识:Django views.py 和 html 之间参数传递关系

Django中的View部分,就是如何用代码来与models中定义的字段进行交互。与传统MVC分层定义略有不同的是,在Django中,View的功能是对页面请求进行响应和逻辑控制,而页面内容的表示则由Django的Template模板来完成。我们可以把Django的View理解为实现各种功能的Python函数,View负责接受URL配置文件urls.py中定义的URL转发并响应处理,当Django收到请求之后调用相应的View函数来完成功能,article模块中的views.py文件代码定义如下:

views.py代码定义

from django.shortcuts import render_to_response from news.article.models import List def news_report(request): article_listing = [] for article_list in List.objects.all(): article_dict = {} article_dict[&apos;news_object&apos;] = article_list article_dict[&apos;item_count&apos;] = article_list.item_set.count() article_dict[&apos;items_title&apos;] = article_list.title article_dict[&apos;items_complete&apos;] = article_list.item_set.filter(completed=True).count() article_dict[&apos;percent_complete&apos;] = int(float(article_dict[&apos;items_complete&apos;]) / article_dict[&apos;item_count&apos;] * 100) article_listing.append(article_dict) return render_to_response(&apos;news_report.html&apos;, { &apos;article_listing&apos;: article_listing })

这是一段简洁的Python代码,让我们看看在这段代码里面Django的函数做了哪些工作吧:

List.objects.all方法返回news列表中所有的记录项,Django可以根据后台数据库转换成相应的SQL语句,在后台数据库中执行并返回查询结果。

每一条article文章都有item_set属性,代表news新闻条目中的每一个item项。如果需要设置查询条件,也可以使用item_set.filter方法来返回符合特定要求的item项。

render_to_response函数返回浏览器指定的HTML页面,页面为Django的Template模板,负责展示被请求的页面内容。

在view部分的代码中,已经指定了页面显示模板为news_report.html。其实,在Django工程中创建模板是一件非常方便的事情,下面要在article目录内创建这个模板页面,首先新建一个名为templates的文件夹,然后在这个模板目录里创建所需的news_report.html模板文件,模板的代码如下:

news_report模板代码

< html> < head> < meta 127.0.0.1:8000/report/,将会看到新闻列表的返回界面。页面中显示了数据库中已添加所有新闻的分类统计信息。值得一提的是,Django模板支持多层嵌套,并且每一层都可以使用DIV+CSS方式完成布局,可以方便的让站点页面遵循统一风格,看起来美观大方。

在上述整个过程中,对使用Django进行Web开发进行了初步的介绍。在应用中写的Python代码不过几十行,比较起来其他的开发语言,Django显得非常便捷实用,最后再来回顾一下Django都帮助我们做了哪些工作吧:

通过Django的对象关系映射模型建立了存储新闻分类以及新闻项的两张数据表,并用syncdb命令同步更新到数据库。

借助Django的管理功能在应用中生成了一个漂亮实用的后台管理界面。

利用Django函数和标签编写了view功能模块以及显示数据结果的Template模板。

以上这篇Django实现将views.py中的数据传递到前端html页面,并展示就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持易盾网络。

标签:数据传递