根据自我需求,thymeleaf可以直接将后端数据传递给js中进行使用,例如:

1.后端接口数据:

@Controller
public class TestController {
@RequestMapping(value = "test", method = RequestMethod.GET)
public String test(Model model) {
model.addAttribute("test", "hello");
return "index";
}
}

利用thymeleaf将其传递给js使用:

<script th:inline="javascript">

    var test= [[${test}]];
console.log(test); </script>

注:[[…]]之间的内容可以被赋值。为了使其生效,必须在此标签或者任何父标签上有th:inline属性。此属性有三种值(text , javascript and none)

thymeleaf 将后端绑定数据直接传递js变量的更多相关文章

  1. Mvc_前后端绑定数据json集合

    ViewBag.SysModuleList =new  List<SysModule>(){.....}; var data = @Html.Raw(Json.Encode(ViewBag ...

  2. 【 D3.js 选择集与数据详解 — 1 】 使用datum()绑定数据

    选择集和数据的关系是 D3 最重要的基础,在[入门 - 第 7 章]时进行过些许讲解,对于要掌握好 D3 是远远不够的.故此开设一个新的分类,专门讨论选择集与数据的关系,包括数据绑定的使用和工作原理, ...

  3. 【 D3.js 选择集与数据详解 — 3 】 绑定数据的顺序

    data() 函数有两个参数,第一个是被绑定数据,第二个参数用于指定绑定的顺序.在数据需要更新的时候常常会用到. 默认的情况下,data()函数是按照索引号依次绑定数组各项的.第0个元素绑定数组的第0 ...

  4. 【 D3.js 选择集与数据详解 — 2 】 使用data()绑定数据

    D3 中绑定数据大多是由 data() 函数来完成的,它是怎样工作的,它与 datum() 有什么区别呢? data()函数能够将数组各项分别绑定到各元素上,而且能够设置绑定的规则.data()还能够 ...

  5. Thymeleaf前后端传值 页面取值与js取值

    参考: Thymeleaf前后端传值 页面取值与js取值 Thymeleaf 与 Javascript Thymeleaf教程 (十二) 标签内,js中使用表达式 目的: 后端通过Model传值到前端 ...

  6. 让前端独立于后端进行开发,模拟数据生成器Mock.js

    让前端独立于后端进行开发,模拟数据生成器Mock.jsMock.js 是一款模拟数据生成器,旨在帮助前端攻城师独立于后端进行开发,帮助编写单元测试. Home · nuysoft/Mock Wiki ...

  7. D3.js系列——初步使用、选择元素与绑定数据

    D3 的全称是(Data-Driven Documents),顾名思义可以知道是一个被数据驱动的文档.听名字有点抽象,说简单一点,其实就是一个 JavaScript 的函数库,使用它主要是用来做数据可 ...

  8. easyUI之datagrid绑定后端返回数据的两种方式

    先来看一下某一位大佬留下的easyUI的API对datagrid绑定数据的两种方式的介绍. 虽然精简,但是,很具有“师傅领进门,修行靠个人”的精神,先发自内心的赞一个. 但是,很多人和小编一样,第一次 ...

  9. D3.js的v5版本入门教程(第三章)—— 选择元素和绑定数据

    D3.js的v5版本入门教程(第三章) 在D3.js中,选择元素和绑定元素是最基本的内容,也是很重要的内容,等你看完整个教程后你会发现,这些D3.js教程都是在选择元素和绑定元素的基础上展开后续工作的 ...

随机推荐

  1. 04_枚举类型iota

    iota是枚举类型的关键字,使用iota可以方便快捷的给常量赋值,主要体现在以下几个方面:1.iota常量自动生成器,每个一行加12.iota给常量赋值使用3.iota遇到const重置为04.可以写 ...

  2. Win10中用yolov3训练自己的数据集全过程(VS、CUDA、CUDNN、OpenCV配置,训练和测试)

    在Windows系统的Linux系统中用yolo训练自己的数据集的配置差异很大,今天总结在win10中配置yolo并进行训练和测试的全过程. 提纲: 1.下载适用于Windows的darknet 2. ...

  3. IDEA maven使用tomcat7插件启动报错:A child container failed during start

    使用maven的tomcat7插件启动项目时出现上面的错误:A child container failed during start, 出现这个问题的原因是导入了servlet-api包,与tomc ...

  4. eclipse中导入外部包却无法查看对应源码或Javadoc的入坑指南

    eclipse中导入外部包却无法查看对应源码或Javadoc的 入坑指南 出现这个错误的原因是,你虽然导入了.jar包,但没有配置对应的Javadoc或源码路径,所以在编辑器中无法查看源 码和对应AP ...

  5. HDU3652:B-number(数位DP)

    Problem Description A wqb-number, or B-number for short, is a non-negative integer whose decimal for ...

  6. SQL,如果碰到Json,你会怎么做?

    1.Json串如下: DECLARE @JsonInfo NVARCHAR() SET @JsonInfo=N' { "CalcPayInput":{ ", " ...

  7. Python批量删除mysql中千万级大量数据

    场景描述 线上mysql数据库里面有张表保存有每天的统计结果,每天有1千多万条,这是我们意想不到的,统计结果咋有这么多.运维找过来,磁盘占了200G,最后问了运营,可以只保留最近3天的,前面的数据,只 ...

  8. Python默认参数

    在python函数中, 可以使用如下方式声明并初始化参数 def to_smash(total_candies, n_friends=3): """Return the ...

  9. 基于 HTML5 的 PID-进料系统可视化界面

    前言 随着工业物联网和互联网技术的普及和发展,人工填料的方式已经逐渐被机械设备取代.工业厂商减小误操作.提升设备安全以及追求高效率等制造特点对设备的要求愈加高标准.严要求.同时机械生产以后还需遵从整个 ...

  10. Unity3D_04_GameObject,Component,Time,Input,Physics

    Unity3D是一个Component-Based的游戏引擎,并且为GamePlay Programmer提供了很多游戏性层上的支持. 1.可以在图形界面上设计动画状态转换的Animator. 2.可 ...