在使用thymeleaf模板時，如果想要獲取從后台傳回來的數據，可以在controller里作如下處理：
@RequestMapping(value = {"/objectDetail/imageInfo","push/objectDetail/imageInfo"}, method = {RequestMethod.POST,RequestMethod.GET})
public String imageInfo(Model model) throws IOException {
//初始化界面
List<ImageVo> list = new ArrayList<ImageVo> ();
String[] arrs={"http://tdhotimagetest.oss-cn-hongkong.aliyuncs.com/ff1749de-f115-46ad-bde9-8b569513564e.JPEG","../_resources/images/test/14.jpg","../_resources/images/test/15.jpg"};
for(int i =0;i<3;i++){
ImageVo imageVo = new ImageVo();
imageVo.setHeight(200);
imageVo.setWidth(150);
imageVo.setImageUrl(arrs[i]);
imageVo.setId(i+"");
list.add(imageVo);
}
model.addAttribute("imageVos",list);
return "objectDetail/index";
}
然后在頁面上循環輸出后台傳來的對象需要：
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<head>
<meta charset="utf-8"/>
<title>jQuery圖像選擇器插件-xw素材網</title>
<script th:src="@{/_resources/js/image-picker/jquery.min.js}" type="text/javascript"></script>
<script th:src="@{/_resources/js/image-picker/prettify.js}" type="text/javascript"></script>
<script th:src="@{/_resources/js/image-picker/jquery.masonry.min.js}" type="text/javascript"></script>
<script th:src="@{/_resources/js/image-picker/image-picker.min.js}" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" th:href="@{/_resources/css/image-picker/bootstrap-responsive.css}"/>
<link rel="stylesheet" type="text/css" th:href="@{/_resources/css/image-picker/examples.css}"/>
<link rel="stylesheet" type="text/css" th:href="@{/_resources/css/image-picker/image-picker.css}"/>
<link rel="stylesheet" type="text/css" th:href="@{/_resources/css/image-picker/bootstrap.css}"/>
</head>
<body th:inline="text">
<form>
<div id="container">
<div class="picker">
<select class='image-picker show-labels' id="selected1">
<option th:each="imageVo: ${imageVos}" th:attr ="data-img-src=${imageVo.imageUrl}" th:value="${imageVo.id}" ></option>
</select>
</div>
需要注意的是，src標簽較為特殊，需要使用th:attr方式才能輸出后台對象的值。
以下為網頁資料：
http://www.blogjava.net/bjwulin/archive/2013/02/07/395234.html
thymeleaf，我個人認為是個比較好的模板，性能也比一般的，比如freemaker的要高，而且把將美工和程序員能夠結合起來，美工能夠在瀏覽器中查看靜態效果，程序員可以在應用服務器查看帶數據的效果。
thymeleaf是一個支持html原型的自然引擎，它在html標簽增加額外的屬性來達到模板+數據的展示方式，由於瀏覽器解釋html時，忽略未定義的標簽屬性，因此thymeleaf的模板可以靜態運行。
由於thymeleaf在內存緩存解析后的模板，解析后的模板是基於tree的dom節點樹，因此thymeleaf適用於一般的web頁面，不適合基於數據的xml。
thymeleaf 的context，即提供數據的地方，基於web的context，即WebContext相對context增加 param,session,application變量，並且自動將request atttributes添加到context variable map，可以在模板直接訪問。
在模板處理前，thymeleaf還會增加一個變量execInfo，比如${execInfo.templateName},${execInfo.now}等。
數據訪問模式：
${...}，變量引用模式，比如${myBean.property}，如果用springDialect，則使用的是spring EL，如果不用spring，則用的ognl。
*{...}，選擇表達式，一般是th:object之后，直接取object中的屬性。當沒有選取對象時，其功能等同${...},*{firstName}也等同於${#object.firstName},#object代表當前選擇的對象。
@{...}鏈接url的表達式。th:href="@{/xxx/aa.do(id=${o.id})"，會自動進行url-encoding的處理。@{...}內部可以是需要計算的表達式，比如：
需要注意的：
表達式基本對象：
#ctx：context object
#root或者#vars
#locale
#httpServletRequest
#httpSession
表達式功能對象：
#dates：java.util.Date的功能方法類。
#calendars:類似#dates，面向java.util.Calendar
#numbers:格式化數字的功能方法類。
#strings：字符串對象的功能類，contains,startWiths,prepending/appending等等。
#objects:對objects的功能類操作。
#bools:對布爾值求值的功能方法。
#arrays：對數組的功能類方法。
#lists:對lists功能類方法
#sets
#maps
#aggregates:對數組或者集合創建聚合的功能方法，
#messages:在變量表達式中獲取外部信息的功能類方法。
#ids：處理可能重復的id屬性的功能類方法。
條件操作：
(if)?(then):滿足條件，執行then。
(if)?(then):(else)
(value)?:(defalutValue)
一些標簽：
th:text="${data}",將data的值替換該屬性所在標簽的body。字符常量要用引號，比如th:text="'hello world'",th:text="2011+3",th:text="'my name is '+${user.name}"
th:utext，和th:text的區別是"unescaped text"。
th:with,定義變量，th:with="isEven=${prodStat.count}%2==0"，定義多個變量可以用逗號分隔。
th:attr，設置標簽屬性，多個屬性可以用逗號分隔，比如th:attr="src=@{/image/aa.jpg},title=#{logo}"，此標簽不太優雅，一般用的比較少。
th:[tagAttr],設置標簽的各個屬性，比如th:value,th:action等。
可以一次設置兩個屬性，比如：th:alt-title="#{logo}"
對屬性增加前綴和后綴，用th:attrappend，th:attrprepend,比如：th:attrappend="class=${' '+cssStyle}"
對於屬性是有些特定值的，比如checked屬性，thymeleaf都采用bool值，比如th:checked=${user.isActive}
th:each, 循環，<tr th:each="user,userStat:${users}">,userStat是狀態變量，有 index,count,size,current,even,odd,first,last等屬性，如果沒有顯示設置狀態變量，thymeleaf會默 認給個“變量名+Stat"的狀態變量。
th:if or th:unless，條件判斷，支持布爾值，數字（非零為true)，字符，字符串等。
th:switch，th:case，選擇語句。 th:case="*"表示default case。
th:fragment，th:include,th:substituteby:fragment為片段標記，指定一個模板內一部分代碼為一個片段，然后在其它的頁面中用th:include或th:substituteby進行包含。
包含的格式為，格式內可以為表達式，比如th:include="footer::$(user.logined)?'logined':'notLogin'"：
"templatename::fragname"，指定模板內的指定片段。
"templateName::[domselector]"，指定模板的dom selector，被包含的模板內不需要th:fragment.
”templatename"，包含整個模板。
th:include和th:substituteby的區別在於前者包含片段的內容到當前標簽內，后者是用整個片段（內容和上一層）替換當前標簽（不僅僅是標簽內容）。
th:remove="all|body|tag|all-but-first"，一般用於將mock數據在真實環境中移除，all表示移除標簽以及標簽內容，body只移除內容，tag只移除所屬標簽，不移除內容，all-but-first，除第一條外其它不移除。
由 於一個標簽內可以包含多個th:x屬性，其先后順序為：include,each,if/unless/switch/case,with,attr /attrprepend/attrappend,value/href,src ,etc,text/utext,fragment,remove。
內聯文本：[[...]]內聯文本的表示方式，使用時，必須先用th:inline="text/javascript/none"激活，th:inline可以在父級標簽內使用，甚至作為body的標簽。內聯文本盡管比th:text的代碼少，但是不利於原型顯示。
內聯js:
/*<![CDATA[*/
...
var username = /*[[${sesion.user.name}]]*/ 'Sebastian';
...
/*]]>*/
</script>
js附加代碼：
var msg = 'This is a working application';
+]*/
js移除代碼：
var msg = 'This is a non-working template';
/* -]*/
模板緩存：
1、指定特定的緩存：
templateResolver.getCacheablePatternSpec().addPattern("/users/*");
2、清除緩存：
templateEngine.clearTemplateCacheFor("/users/userList");
補充點url知識：
1、絕對路徑：http://news.sina.com.cn
2、相對路徑：
2.1：頁面相對路徑，一般指相對當前請求的url，比如 aa.do
2.2:上下文相對，比如/xxx/aa.do
2.3:服務器相對路徑，比如~/other/xxx/aa.do,允許切換到相同服務器不同上下文的路徑。