解决Thymeleaf 中 th:if、th:each、th:href、th:onclick、th:src等问题亲测

最近使用若依，对前端的thymeleaf语法不是很熟悉，下面是自己的笔记，大神请忽略。 

一、th:if 

gt:     great than（大于）>
ge：    great equal（大于等于）>=
eq：    equal（等于）==
lt：    less than（小于）<
le：    less equal（小于等于）<=
ne：    not equal（不等于）!=

写法如下，其它写法类似。 

<div th:if="${substringName} ne null"></div>

th:if多条件判断 :

<div th:if="(${t.pid}==${s.id}) and ${t.recycle!=1}"></div>

二、th:each 

（1）页面：

<tr th:each="userStat : ${list}">
                <td th:text="${userStat.substringName}"></td>
                <td id="ids" th:value="${userStat.id}" ></td>
</tr>

 后台：

List list = new ArrayList();
HashMap<Object, Object> objectObjectHashMap = new HashMap<>();
objectObjectHashMap.put("id", value.getId());
objectObjectHashMap.put("substringName", substringName);
objectObjectHashMap.put("returnContractPath", returnContractPath());
list.add(objectObjectHashMap);
map.put("list",list);

 （2）下拉框传值问题：

<!-- th:text 为显示的值，th:value 为实际传值 -->
<select name="contactsId" class="form-control" id="contactsId" required>
             <option value="">请选择联系人</option>
             <option th:each="list:${sysContacts}" th:value="${list.id}"
                   th:text="${list.contactName}"></option>
</select>

 三、js中引用thymeleaf

<!-- 注意标签 -->
<script th:inline="javascript"> 
    var editFlag = [[${@permission.hasPermi('system:quotation:edit')}]];
    var checkFlag = [[${@permission.hasPermi('system:quotation:check')}]];
</script>

 四、th:href多参数

<a th:href="@{'/system/business/downloadFail?failName='+${userStat.substringName}+'&returnContractPath='+${userStat.returnContractPath}}">
<input type="button" class="btn-xs btn-info" style="width: 40px" value="下载"/>
</a>

五、th:onclick多参数

<a href="#" th:onclick="removeFile([[${userStat.id}]],[[${userStat.returnContractPath}]]);">
<input type="button" class="btn btn-danger btn-xs" style="width: 40px" value="删除"/>
</a>

 js代码：

 function removeFile(userStatId,returnContractPath) {
        var formData = new FormData();
        formData.append("id",userStatId);
        formData.append("returnContractPath",returnContractPath);
        $.ajax({
            url: prefix + "/removeFail",
            type: 'post',
            async: false,
            data: formData,
            processData: false,
            contentType: false,
            success: function(result) {
                $.operate.successCallback(result);
            },
        })
    }

六、 th:src 图片引用

<!-- 如果引用的图片来自线上，直接赋值即可: -->
<img src="https://baidu.com/xxx.jpg">

<!-- 如果是静态赋值，写法上略有不同: -->
<img  th:src="@{../img/001.jpg}">

<!-- 如果是动态赋值，前端代码  -->
<img src="" id="weather-icon">

<!-- js 代码： -->
$("#weather-icon").attr("src","/weatherforecast/assets/weatherIcon/100.png");

先写这么多， 后续待补充。。。

​