如何在django中使用简单菜单

Question

I have below html code for submenu. Now i have to integrate with my django application.

HTML代码:

<nav class="main-navigation" data-height="auto" data-size="6px" data-distance="0" data-rail-visible="true" data-wheel-step="10">
                    <p class="nav-title">MENU</p>
                    <ul class="nav">
                        <!-- dashboard -->
                        <li>
                            <a href="a.html">
                                <i class="ti-home"></i>
                                <span>Dashboard</span>
                            </a>
                        </li>
                        <li>
                            <a href="javascript:;">
                                <i class="toggle-accordion"></i>
                                <i class="ti-support"></i>
                                <span>Category1</span>
                            </a>
                            <ul class="sub-menu">
                                <li>
                                    <a href="SubCategory1.html">
                                        <span>Sub Category1</span>
                                    </a>
                                </li>
                                <li>
                                    <a href="SubCategory2.html">
                                        <span>Sub Category2</span>
                                    </a>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <a href="javascript:;">
                                <i class="toggle-accordion"></i>
                                <i class="fa fa-file-text-o"></i>
                                <span>Category2</span> 
                            </a>
                            <ul class="sub-menu">
                                <li>
                                    <a href="SubCategory7.html">
                                        <span>SubCategory7</span>
                                    </a>
                                </li>
                            </ul>
                        </li>
                </nav>

我已经使用了简单的菜单模块。但我不明白如何在下面的代码中应用简单菜单中的启动类。对于这个子菜单，我必须使用简单的子菜单?我试过简单的菜单代码如下。

<nav class="main-navigation" data-height="auto" data-size="6px" data-distance="0" data-rail-visible="true" data-wheel-step="10">
                    <p class="nav-title">MENU</p>
                    <ul class="nav">
                        {% for item in menu%}
                        <li>
                            <a href="{{ item.url }}">
                                <i class="ti-home"></i>
                                <span>{{ item.title }}</span>
                            </a>
                        </li>
                        <li>
                            <ul class="sub-menu">
                                {% for child in item.children%}
                                <li>
                                    <a href="{{ item.url }}">
                                        <span>{{ child.title }}</span>
                                    </a>
                                </li>
                            </ul>
                        </li>
                        <!-- /ui -->
                </nav>

在上面的代码中如何为特定的html标签应用不同的类在for循环中

Answer 1

你可以使用随机生成的类，也可以使用Django的cycle标签。

使用随机生成的类:

{% for item in menu%}
    <li>
        <a href="{{ item.url }}">
            <i class="ti-home-{{forloop.counter}}"></i>
            <span>{{ item.title }}</span>
        </a>
    </li>
...

使用循环标签:

{% for item in menu%}
    <li>
        <a href="{{ item.url }}">
            <i class="{% cycle "ti-home-1" "ti-home-2" "ti-home-3" "ti-home-end"%}"></i>
            <span>{{ item.title }}</span>
        </a>
    </li>
...