主頁 > 知識庫 > thymeleaf實(shí)現(xiàn)th:each雙重多重嵌套功能

thymeleaf實(shí)現(xiàn)th:each雙重多重嵌套功能

熱門標(biāo)簽:怎么去掉地圖標(biāo)注文字 合肥阿里辦理400電話號 海南人工外呼系統(tǒng)哪家好 地圖標(biāo)注資源分享注冊 慶陽外呼系統(tǒng)定制開發(fā) 廊坊地圖標(biāo)注申請入口 襄陽外呼增值業(yè)務(wù)線路解決方案 北京外呼系統(tǒng)咨詢電話 高德地圖標(biāo)注公司位置需要錢嗎

博主最近在做一個(gè)個(gè)人的博客網(wǎng)站,準(zhǔn)備用 thymeleaf 實(shí)現(xiàn)一個(gè)動(dòng)態(tài)加載一二級文章分類的功能,效果如下:

后臺實(shí)體類代碼如下:

/**
 * @author 曲健磊
 * @date 2019-08-22 20:28:18
 * @description 一級分類實(shí)體類
 */
public class CateVO {
  /**
   * 一級分類id
   */
  private Integer cate1Id;
  /**
   * 一級分類名稱
   */
  private String cate1Name;
  /**
   * 該一級分類下的二級分類列表
   */
  private ListCate2> cate2List;
 // 省略set get方法
}
/**
 * @author 曲健磊
 * @date 2019-08-15 20:18:44
 * @description 二級分類實(shí)體類
 */
public class Cate2 {
 /**
   * 二級分類id
   */
  private Integer id;
 /**
   * 二級分類名稱
   */
  private String cateName;
}

Controller 層的代碼如下:

@Controller
@RequestMapping("/")
public class IndexController {
  @Autowired
  private CateService cateService;
 /**
 * 我配置的項(xiàng)目端口號是:80
 * 所以,當(dāng)用戶在瀏覽器上輸入:127.0.0.1:80 或 127.0.0.1 時(shí)請求會進(jìn)到這個(gè)方法里
 */
  @GetMapping("/")
  public String defaultWebPage(HttpServletRequest request){
    // 1.模擬獲取所有的一級分類以及每個(gè)一級分類下的所有二級分類
 ListCateVO> allCateList = new ArrayListCateVO>();
 // 1.1.一級分類
 CateVO cateVO1 = new CateVO();
 cateVO1.setCate1Id(1);
 cateVO1.setCate1Name("大數(shù)據(jù)");
 
 // 1.2.該一級分類下的二級分類列表
 ListCate2> cate2_1List = new ArrayListCate2>();
 
 // 1.2.1.第一個(gè)二級分類
 Cate2 cate2_1_1 = new Cate2();
 cate2_1_1.setId(1);
 cate2_1_1.setCateName("Hadoop");
 
 // 1.2.2.第二個(gè)二級分類
 Cate2 cate2_1_2 = new Cate2();
 cate2_1_2.setId(1);
 cate2_1_2.setCateName("Spark");
 
 cate2_1List.add(cate2_1_1);
 cate2_1List.add(cate2_1_2);
 // 1.3.把所有的二級分類添加到該一級分類下
 cateVO1.setCate2List(cate2_1List);
 // 1.4.把所有的一級分類放入列表中,多個(gè)的話以此類推(通常都是直接查數(shù)據(jù)庫的)
 allCateList.add(cateVO1);
 // 2.將一級分類列表放入 request 域中。
    request.setAttribute("cateList", allCateList);
    // 3.返回 index.html 頁面
    return "index";
  }
}

前臺 html 的代碼如下(簡化):

!DOCTYPE HTML>
!-- thymeleaf的引用 -->
html xmlns:th="http://www.thymeleaf.org">
head>
!-- 引用的css,js -->
/head>
!-- 頁面主體 -->
body>
ul>
 !-- 這一級是一級的分類 -->
  li th:each="cate1:${cateList}">a th:text="${cate1.cate1Name}">/a>
   !-- 這是一級下的二級分類列表 -->
    ul>
     li th:each="cate2:${cate1.cate2List}">a th:text="${cate2.cateName}">/a>/li>
    /ul>
  /li>
/ul>
/body>
/html>

博主直接用 java 代碼解釋一下上面的 th:each 那里是什么意思吧:

// cateList 就是我們在 Controller 中向 request 域中設(shè)置的那個(gè)屬性
for (CateVO cate1 : cateList) {
 System.out.println(cate1.cate1Name);
 
 // cate1這個(gè)變量現(xiàn)在就存在于request域中,我們可以直接調(diào)用它的屬性和方法
 for (Cate2 cate2 : cate1.cate2List) {
 System.out.println(cate2.cateName);
 
 // 依次類推,如果有三級分類這里繼續(xù)調(diào)用cate2的屬性或方法就可以
 }
}

cate1:${cateList} 這個(gè)寫法是固定的格式,冒號前的 cate1 是新定義的臨時(shí)變量,cateList 是我們在 Controller 中放入 request 域中的變量;在一級分類循環(huán)里面,我們是可以直接獲取剛才定義的臨時(shí)變量:cate1 的。

所以,我們可以繼續(xù) th:each 遍歷該一級分類的二級分類列表,三級四級以此類推。

總結(jié)

以上所述是小編給大家介紹的thymeleaf實(shí)現(xiàn)th:each雙重多重嵌套功能,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
如果你覺得本文對你有幫助,歡迎轉(zhuǎn)載,煩請注明出處,謝謝!

您可能感興趣的文章:
  • springboot+thymeleaf+druid+mybatis 多模塊實(shí)現(xiàn)用戶登錄功能
  • Spring boot+mybatis+thymeleaf 實(shí)現(xiàn)登錄注冊增刪改查功能的示例代碼
  • Spring boot2+jpa+thymeleaf實(shí)現(xiàn)增刪改查
  • Thymeleaf對象的使用之基本對象實(shí)例解析
  • SpringBoot使用thymeleaf模板過程解析
  • Spring Boot Thymeleaf實(shí)現(xiàn)國際化的方法詳解
  • SpringBoot引入Thymeleaf的實(shí)現(xiàn)方法
  • Thymeleaf中th:each及th:if使用方法解析

標(biāo)簽:鶴崗 株洲 商丘 平頂山 臺州 鎮(zhèn)江 哈密 綿陽

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《thymeleaf實(shí)現(xiàn)th:each雙重多重嵌套功能》,本文關(guān)鍵詞  thymeleaf,實(shí)現(xiàn),each,雙重,多重,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《thymeleaf實(shí)現(xiàn)th:each雙重多重嵌套功能》相關(guān)的同類信息!
  • 本頁收集關(guān)于thymeleaf實(shí)現(xiàn)th:each雙重多重嵌套功能的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章