Как выделить текущий раздел [Power Apps Menu].

При навигации в строке меню некоторые пункты не выбираются. Я пытался сделать это с помощью JQuery, но мои попытки тщетны.

Вкратце то, что я ищу, это то, что если пользователь нажимает Home Page, то она будет отмечена цветом, а если нажимает About Us, то достаточно вышеуказанного выбора и она будет отмечена как новая.

Я попробовал использовать условие {% if request.path ==" / "%} class =" weblink active mr-3 "{% else%} class =" weblink mr-3 "{% endif%} в "Варианте 1", но оно не сработало. Что я делаю неправильно?

{% if user %}

                <li role="none" {% if request.path=="/"%}class="weblink active mr-3" {% else %} class="weblink mr-3"{% endif %}>

                    <a role="menuitem" aria-label="P&#225;gina principal" href="/" title="P&#225;gina principal" >
                        
                        P&#225;gina principal
                    </a>
                    
                </li>
            
                <!--Option 2-->
                
                <li role="none" class="weblink dropdown">

                    <a role="menuitem" aria-label="Servicios" href="#" class="dropdown-toggle" data-toggle="dropdown" title="Servicios" >
                        
                        Servicios
                        <span class="caret"></span>
                    </a>
                    
                    <ul class="dropdown-menu" role="menu">
                        
                        <li role="none">
                            <a role="menuitem" aria-label="Servicios" href="/services/"   title="Servicios" >Servicios</a>
                        </li>
                        <div class="divider"></div>
                        
                        
                        <li role="none">
                            <a role="menuitem" aria-label="Producto A (ejemplo)" href="/services/product-a/"   title="Producto A (ejemplo)" >
                                Producto A (ejemplo)
                            </a>
                        </li>
                        
                        <li role="none">
                            <a role="menuitem" aria-label="Producto B (ejemplo)" href="/services/product-b/"   title="Producto B (ejemplo)" >
                                Producto B (ejemplo)
                            </a>
                        </li>
                        
                    </ul>
                    
                </li>
                
                <!--Option 3-->
                
                <li role="none" class="weblink">

                    <a role="menuitem" aria-label="Acerca de nosotros" href="/about-us/" title="Acerca de nosotros" >
                        
                        Acerca de nosotros
                    </a>
                    
                </li>
                
                {% endif %}
                
                <!--End Options->

Попробуйте следующим образом:

{% with request.resolver_match.url_name as url_name %}
<li class="nav-item {% if url_name in 'home' %}active{% endif %}">
    <a class="nav-link" href="{% url 'home' %}">
        <span class="menu-title"> Home</span>
    </a>
</li>
<li class="nav-item {% if url_name in 'about' %}active{% endif %}">
    <a class="nav-link" href="{% url 'about' %}">
        <span class="menu-title"> About</span>
    </a>
</li>
{% endwith %}

Переименуйте home и about в желаемый путь URL.

Вернуться на верх