thymeleaf笔记

目录：

一、thymeleaf拼接url

  通常我们的HTML页面中需要请求一些静态资源，如图片、js文件等，又或者是一些如表单提交action、链接请求url等。通常是<a href="path"></a>这样的形式。
  在实际项目中较多的会使用项目相对地址，而非绝对地址，这个时候怎么办呢?thymeleaf定义了自己的url规则。举例如下：

  <a th:href="@{/show.html}"></a>

如上，这个链接实际上发出了一个HTTP请求，如果项目上下文地址为：http://localhost:8080/TestMode 那么这里的HTTP请求就是http://localhost:8080/TestMode/show.html，而img/action等元素亦然，用th:href表明thymeleaf语法，再用@{/path}这样的形式书写相对地址；

二、js中使用EL表达式

  Javaweb开发环境中，如果服务端Controller返回了一个HTML界面（以String或ModelAndView形式），那么随之而来的可能还有一些数据（使用view.addObject(name,value)的形式），在HTML中我们使用EL表达式来获得这些数据；
  如：<span th:text="${user.name}"></span>
  但有时候数据比较复杂，又或者数据需要先进行处理，这个时候一般来说用js比较好。

<script th:inline="javascript">
     $(document).ready(function(){
         var name = [[${user.name}]];
     });
</script>

  如上，我们使用th:inline="javascript"修饰script标签，然后就可以在script包括的js中使用el表达式[[${object}]]直接获得view中的值。

三、处理thymeleaf中js运算符报错问题

  在使用thymeleaf模板引擎时（如SpringBoot中），经常会出现>、&&、||等符号报错的问题。这个很显然是thymeleaf的问题。
  这种情况下可以使用thymeleaf标准方言，如and、or之类来代替&&、||，但如果想要保留原生的js呢？
  使用/*<![CDATA[*/和/*]]>*/分别包含js语句两端，如下：

<script th:inline="javascript">
/*<![CDATA[*/  
$(document).ready(function(){
    //使用这个符号解决thymeleaf中>、&&等符号无效问题
    var message = [[${message}]];
    if(message!=null){
        if(message!=""){
            msg(message);
        }
    }

    var user = [[${user}]];//为什么el写在语句里面就会报错呢？
    if(user!=null && user.email!=null){
        document.getElementById("email").value=user.email;
        document.getElementById("password").value=user.password;
        document.getElementById("rememberPassword").checked=true;
    }  
});/*]]>*/
</script>

未完待续….