简述

在大多数的项目架构中，使用SPringBoot发布微服务，前端采用Thymeleaf作为Html模版，使用Jquery作为动态脚本，那么Thymeleaf和Jquery是如何获取Model中的数据呢？

Jquery获取Model中的数据

方法1：将model中的值赋给hidden，然后Js获取隐藏域的值。

后台的实现：

1@RequestMapping("/QEditorMod1")
2    public String QEditorMod1(ModelMap model){
3        model.addAttribute("staff_name","cxx" );
4        return "questionEditorTemplate/QEditorMod1";
5    }

前端值的获取

1//将值赋给hidden域
2<input type="hidden" th:value="${staff_name}" id="staff_name2"/>
3//Js 获取hidden的隐藏域
4var staff_name2=$("#staff_name2").val();

Thymeleaf 获取model中的值

2、访问model中的数据

1//通过“${}”访问model中的属性
2
3<div class="panel-body">
4         <span th:text="${singlePerson.name}"></span>
5</div>

3、在javascript中访问model 目前没有发现此种方法的应用场景

1<script th:inline="javascript">
2            var single = [[${singlePerson}]];
3            console.log(single.name+"/"+single.age)
4        </script>