Question

我有一个在Django模板中使用的项目列表。每个项目都有一个名称和一个类别。可以使用斜杠分隔类别以创建子类别。我需要将平面列表转换为嵌套的无序HTML列表。做这个的最好方式是什么？在Django视图中使用Python修改数据结构是一个选项，但我更喜欢在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>

将“平面”列表翻译为嵌套的HTML无序列表

1 个答案: