python web-Django html模板特殊符号冲突
模板
作为 Python Web 框架,Django 需要一种很便利的方法以动态地生成 HTML,最常见的做法是使用模板。模板包含所需 HTML 输出的静态部分,以及一些特殊的语法,描述如何将动态内容插入。 Django 项目可以配置一个或多个模板引擎。Django 的模板系统自带内建的后台-称为 Django 模板语言(DTL),以及另外一种流行的 Jinja2。其他的模板语言的后端,可查找第三方库。
问题
在使用 layui 的时候,需要使用到 layui 数据表格的模板,这时候就遇到{{}}转义的问题。在 django 中{{}}是获取变量值,这就跟前段的 layui 的模板冲突了,这时候就需要 django 不转译指定的内容。
<table
class="layui-table"
lay-data="{width: 'auto', height:'auto', url:'/auto_tasks/task_view/', page:true, id:'autotaskviews'}"
lay-filter="autotaskviews_table"
lay-size="xm"
>
<thead>
<tr>
<th lay-data="{field:'id',sort: true, fixed: true,width:'80'}">编号</th>
<th lay-data="{field:'name', sort: true,width: '180'}">任务名称</th>
<th lay-data="{field:'task_type' , sort: true,width: 140}">任务类型</th>
<th lay-data="{field:'task_custom_parameter' ,sort: true,width: '200'}">
自定义参数
</th>
<th lay-data="{field:'username' ,sort: true,width: '120'}">创建者</th>
<th lay-data="{field:'status_label' ,sort: true,width: '100'}">
执行状态
</th>
<th lay-data="{field:'create_time' ,sort: true,width: '190'}">
创建时间
</th>
<th lay-data="{field:'exec_time' ,sort: true,width: '190'}">执行时间</th>
<th lay-data="{field:'detail_result' ,sort: true,width: '200'}">
执行结果
</th>
<th
lay-data="{fixed: 'right', align:'center',width: '180', toolbar: '#barDemo' }"
>
查看详情
</th>
</tr>
</thead>
</table>
<script type="text/html" id="barDemo">
{{# if(d.status == 'Y'){ }}
<button class="layui-btn layui-btn-disabled layui-btn-xs">已执行</button>
{{# } else if(d.status == 'N') { }}
<a class="layui-btn layui-btn-xs" lay-event="exec">执行</a>
{{# } else if(d.status == 'R') { }}
<span class="layui-badge layui-bg-orange layui-btn-xs">执行中</span>
{{# } }}
<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
</script>
解决方法
从 Django 1.5 开始,支持{% verbatim %}标签(verbatim 的意思是逐字翻译的,字面意思的),Django 不会渲染 verbatim 标签包裹的内容,因此修改内容为:
<script type="text/html" id="barDemo">
{% verbatim %} {{# if(d.status == 'Y'){ }}
<button class="layui-btn layui-btn-disabled layui-btn-xs">已执行</button>
{{# } else if(d.status == 'N') { }}
<a class="layui-btn layui-btn-xs" lay-event="exec">执行</a>
{{# } else if(d.status == 'R') { }}
<span class="layui-badge layui-bg-orange layui-btn-xs">执行中</span>
{{# } }} {% endverbatim %}
<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
</script>
- 原文作者:Linux运维菜
- 原文链接:https://www.opcai.top/post/2018/2018-06/django_html/
- 版权声明:本作品采用进行许可,非商业转载请注明出处(作者,原文链接),商业转载请联系作者获得授权。