翻譯「扁平」列表中嵌套的HTML無序列表

Question

我有一個項目清單，在Django模板的工作。每個項目都有一個名稱和一個類別。該類別可以用斜線分隔以創建子類別。我需要把平面列表到嵌套無序的HTML列表。做這個的最好方式是什麼？修改與Python數據結構Django的觀點是一種選擇，但我寧願Django模板渲染內做到這一點。 JavaScript也是解決這個問題的一個選項。

列表保證，因爲我的方式查詢從數據庫中的項目被正確排序。

例如，假設Python的結構：

[ 
    { category: 'Food/Fruits', name: 'Apple' }, 
    { category: 'Food/Fruits', name: 'Banana' }, 
    { category: 'Food/Fruits', name: 'Coconut' }, 
    { category: 'Food/Meats', name: 'Steak' }, 
    { category: 'Food/Meats', name: 'Chicken' }, 
    { category: 'Furniture', name: 'Chair' }, 
] 

我想創建嵌套列表這些項目。這將變成：

<label>Food</label> 
<ul> 
    <li> 
     <label>Fruits 
     <ul> 
      <li>Apple</li> 
      <li>Banana</li> 
      <li>Coconut</li> 
     </ul> 
     </label> 
    </li> 
    <li> 
     <label>Meats 
     <ul> 
      <li>Steak</li> 
      <li>Chicken</li> 
     </ul> 
     </label> 
    </li> 
</ul> 
</label> 
<label>Furniture</label> 
<ul> 
    <li>Chair</li> 
</ul> 
</label> 

渲染的結果是這樣的：

食品

• 水果
  • 蘋果
  • 香蕉
  • 椰子
• 肉類
  • 牛排
  • 雞

傢俱

• 主席

Answer 1

使用regroup標籤：

<label>Food</label> 
{% regroup foods by category as category_list %} 
<ul> 
{% for category in category_list %} 
    <li> 
     <label>{{ category.grouper }}</label> 
     <ul> 
     {% for food in category.list %} 
      <li>{{ food.name }}</li> 
     {% endfor %} 
     </ul> 
    </li> 
{% endfor %} 
</ul>