• django的模板渲染中的【高级定制】:按数据下标id来提取数据


    需求:
    1:在一个页面中显示一张数据表的数据
    2:不能使用遍历的方式
    3:页面中的数据允许通过admin后台来进行修改
    4:把一张数据表的某些内容渲染到[xxx.html]页面
    5:如公司的新商品页面,已有固定的UI样式,允许策划人员登录后台修改数据

    在这里插入图片描述

    在这里插入图片描述

    获取1个模型中的所有数据–查询集合–不能直接得到数据值

    all_list=Articleapi.objects.all()
    ##all_list=<QuerySet [<Articleapi: 1>, <Articleapi: 2>]>
    
    • 1
    • 2

    获取1个模型中的所有数据–查询集合–有数据值
    这时可以遍历提取

    all_list=Articleapi.objects.all().values()
    #all_list=<QuerySet [{'id': 1, 'title': '1', 'content1': 'x'},{'id': 1, 'title': '1', 'content1': 'x'},]>
    
    • 1
    • 2

    django中的views.py文件—把局部变量渲染到【all_list.html】页面中

    def get_all_api_list(request):  
        all_list=Articleapi.objects.all()  
        data_list=all_list.values()  
    
        return render(request,"all_list.html",locals())
    
    • 1
    • 2
    • 3
    • 4
    • 5

    【all_list.html】的代码

    {{ data_list.0}}
    
    • 1
    可以获取到data_list中的下标为0的元素
    得到一个字典
    {'id': 1, 'title': '1', 'content1': 'x'}
    
    • 1
    • 2
    • 3
    {{ data_list.0.content1 }}
    
    • 1
    可以获取到data_list中的下标为0的元素,并且获取到这个字典中key为['content1']的值 "x"
    'x'
    
    • 1
    • 2
    {{ data_list.2 }}
    因为data_list中只有2个元素,所以无法获取到下标为2的元素,这样渲染了也不会报错
    
    • 1
    • 2

    按下标来获取数据

    <div>----------------</div>
    {{ data_list.0.content1 }}
    <div>----------------</div>
    {{ data_list.1 }}
    <div>----------------</div>
    {{ data_list.2 }}
    <div>----------------</div>
    <div>----------------</div>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8

    遍历获取数据

    {% for item in all_list %}
        <h2>{{ item.title }}</h2>
        <p>{{ item.content1 }}</p>
    {% endfor %}
    
    • 1
    • 2
    • 3
    • 4
  • 相关阅读:
    大数据-之LibrA数据库系统告警处理(ALM-12039 GaussDB主备数据不同步)
    OpenGL_Learn15(投光物)
    【C++】C++实战项目机房预约管理系统
    go学习之函数知识
    Linux - Django + Nginx + uWSGI 部署项目 - 安装 Python3.x -(2)
    通用HttpClient封装
    React 第一个Demo
    Python实现2048小游戏
    vue2、vue3、react响应式原理、组件声明周期阐述与对比
    Hadoop-HA节点介绍
  • 原文地址:https://blog.csdn.net/weixin_47021806/article/details/136425798