這篇文章主要介紹了Angular中directive遞歸怎么實(shí)現(xiàn)目錄樹(shù)結(jié)構(gòu)，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

10年積累的網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站建設(shè)經(jīng)驗(yàn)，可以快速應(yīng)對(duì)客戶對(duì)網(wǎng)站的新想法和需求。提供各種問(wèn)題對(duì)應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識(shí)你，你也不認(rèn)識(shí)我。但先網(wǎng)站設(shè)計(jì)后付款的網(wǎng)站建設(shè)流程，更有文成免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。

效果圖：

重點(diǎn)：

1. 整棵目錄樹(shù)的實(shí)現(xiàn)，通過(guò)嵌套完成，主要在于對(duì)treeItem.html的遞歸使用

  

    


      

    

  

  

  

    

    {{item.name}}

    

      

    

  

2. 點(diǎn)擊展開(kāi)/關(guān)閉目錄樹(shù)

通過(guò)ng-show對(duì)item.expand進(jìn)行判斷，點(diǎn)擊item時(shí)切換其expand參數(shù)，完成目錄樹(shù)的打開(kāi)與關(guān)閉

3. 源碼

  

  
Introduce: Click green block expand the menu tree
  
Red: Leaf node, can not click
  
Green: Unexpand node, click to expand menu
  
Yellow: Expanded node, click to unexpand menu
  
  



  

    
  


  
  {{item.name}}
  
    
  

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“Angular中directive遞歸怎么實(shí)現(xiàn)目錄樹(shù)結(jié)構(gòu)”這篇文章對(duì)大家有幫助，同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!