javascript - 无法解析为在 Thymeleaf 中定义 DataTable 的表达式
问题描述
我有一个基本的 SpringBoot 2.0.4.RELEASE 应用程序。使用 Spring Initializer、JPA、嵌入式 Tomcat、Thymeleaf 模板引擎,并将其打包为可执行的 JAR 文件。
我在模板中有这个数据表的定义
<script th:inline="javascript">
/*<![CDATA[*/
$.fn.dataTable.ext.errMode = 'throw';
var ajaxUrl = /*[[@{${ajaxUrl}}]]*/ "";
var table = $('#smsEventTable').DataTable( {
order: [[ 0, "desc" ]],
select: true,
bLengthChange: false,
stateSave: true,
pageLength: 20,
ajax: ajaxUrl,
"columns": [
{ data: 'id' },
{ data: 'smsId' },
{ data: 'companyName' },
{ data: 'description' },
{ data: 'battery', className: 'col_battery' },
{ data: 'dateTime' },
{ data: 'signal' },
{ data: 'data' },
{ data: 'alarm' }
]
});
/*]]>*/
</script>
但是我第一次加载页面并且没有数据时出现此错误:
Caused by: org.thymeleaf.exceptions.TemplateProcessingException: Could not parse as expression: " 0, "desc" " (template: "/sms/smsList" - line 273, col 12)
解决方案
这里的问题是这个表达式:order: [[ 0, "desc" ]],
. 因为该表达式有双括号 ( [[
and ]]
),Thymeleaf 试图将其评估为内联表达式。解决此问题的最简单方法是通过拆分括号来进行不同的格式化:
order: [ [0, "desc"] ],
或者
order: [
[0, "desc"]
],
您还可以将 JavaScript 分成两个块(在第二个块中禁用内联),如下所示:
<script th:inline="javascript">
var ajaxUrl = /*[[@{${ajaxUrl}}]]*/ "";
</script>
<script th:inline="none">
/*<![CDATA[*/
$.fn.dataTable.ext.errMode = 'throw';
var table = $('#smsEventTable').DataTable({
order: [[0, "desc"]],
select: true,
bLengthChange: false,
stateSave: true,
pageLength: 20,
ajax: ajaxUrl,
"columns": [
{data: 'id'},
{data: 'smsId'},
{data: 'companyName'},
{data: 'description'},
{data: 'battery', className: 'col_battery'},
{data: 'dateTime'},
{data: 'signal'},
{data: 'data'},
{data: 'alarm'}
]
});
/*]]>*/
</script>
推荐阅读
- angular - Formdata 没有附加值
- react-native - 错误:无法在反应原生 expo-video-thumbnails IOS 中写入文件错误
- spring - 在 PostgreSQL /SpringBoot 中创建表时 SQL 查询错误
- image - 随图片大小动态放大行高
- c - 如何使用堆栈解决库存跨度问题?
- mongodb - 任何想法如何在 Quarkus MongoDB Panache 中将字段标记为唯一
- java - 如何在 spring.datasource.url 中使用 2 个默认值
- python - Plotly:如何使用 MULTIPLE 下拉菜单选择图形源?
- matlab - Rounding up to the nearest tenth
- ios - 在 iOS 模拟器上运行 Flutter 应用失败