thymeleaf學習筆記

1.導入thymeleaf名稱空間

<html lang="zh-Hans" xmlns:th="http://www.thymeleaf.org">

2.thymeleaf語法

2.1 循環遍歷 th:each

<div th:each="article,ArticleList:${articleList}"></div>

2.2 三元運算

解釋:若是article.getArticleCover獲得的值不是'' 則該div應用cover這個class屬性不然noimghtml

<div th:class="${article.getArticleCover()!=''}?cover:noimg">

2.3 時間格式化

<div class="stat" th:text="${#dates.format(article.getUpdateDate(), 'yyyy-MM-dd HH:mm:ss')}">

 

示例

<div class="article" th:each="article,ArticleBean:${articleList}">
                    <a th:href="'http://localhost:8080/p/'+${article.getArticleId()}+'.html'" target="_blank">
                        <div class="row">
                        <div class="title" th:text="${article.getArticleTitle()}">

                        </div>
                        <div th:class="${article.getArticleCover()!=''}?cover:noimg">
                            <img th:src="${article.getArticleCover()}" th:class="${article.getArticleCover()!=''}?img:noimg"/>
                        </div>
                        <div class="sketch" th:text="${article.getArticleSketch()}">

                        </div>
                        <div class="other">
                            <div class="icon">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="stat" th:text="${article.getArticleAuthor()}">

                            </div>
                            <div class="icon">
                                <span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
                            </div>
                            <div class="stat" th:text="${article.getArticleReadNum()}">

                            </div>
                            <div class="icon">
                                <span class="glyphicon glyphicon-tag" aria-hidden="true"></span>
                            </div>
                            <div class="stat next" th:text="${article.getArticleLabel()}">

                            </div>
                            <div class="icon">
                                <span class="glyphicon glyphicon-time" aria-hidden="true"></span>
                            </div>
                            <div class="stat" th:text="${#dates.format(article.getUpdateDate(), 'yyyy-MM-dd HH:mm:ss')}">

                            </div>
                        </div>
                        </div>
                    </a>
                </div>
相關文章
相關標籤/搜索