Symfony 导航，突出显示当前页面

我有一个父布局，并从该子站点派生

父布局有一个导航，每个导航点代表一个子站点

如何在父布局中突出显示当前查看的子站点？

---

if应该是什么样子？

为突出显示的菜单项创建一个css类，并为每个导航项绑定一个onClick JS事件，当该事件被触发时，只需将该类添加到当前导航项并将其从其他导航项中删除，它应该在导航中突出显示所选站点。

可能不是最佳选项，但以下是基于路由名称的Symfony2的一些简单方法：

<ul class="nav">
  <li{% if app.request.get('_route') == '_adminIndex' %} class="active"{% endif %}>
    <a href="{{ path('_adminIndex') }}">Admin Home</a>
  </li>
</ul>

以下是我所做的：

<a href='{{ path( 'products' ) }}'{% if app.request.attributes.get( '_route' ) starts with 'products' %} class='active'{% endif %}>Products</a>
<ul>
    <li><a href='{{ path( 'products_product1' ) }}'{% if app.request.attributes.get( '_route' ) == 'products_product1' %} class='active'{% endif %}>Product 1</a></li>
    <li><a href='{{ path( 'products_product2' ) }}'{% if app.request.attributes.get( '_route' ) == 'products_product2' %} class='active'{% endif %}>Product 2</a></li>
</ul>

我知道这是一个旧的线程，但你仍然可以在谷歌的前三名中找到它，所以这里有一些更新

在使用Symfony创建带有“突出显示类”的导航时，您可以采取不同的方法

1。检查路线
根据建议，您可以向if else查询路线

<li{% if app.request.get('_route') == 'foo_products_overview' %} class="active"{% endif %}>

正如我所说，我使用这个，还没有出现问题

2。使用捆绑包/功能 我肯定还有其他捆绑包，但我建议您使用以下内容来创建导航：

3。使用宏 2015年7月编辑
我最喜欢的是使用宏，比如

{% macro menuItem(name, url, subitems) %}
    {% spaceless %}
        {% set subitems = subitems|default({}) %}
        {% set currentUrl = path(app.request.attributes.get('_route'), app.request.attributes.get('_route_params')) %}
        {% set isActive = currentUrl == url %}

        {% for name, suburl in subitems %}
            {% set isActive = not isActive and currentUrl == suburl %}
        {% endfor %}

        <li{% if isActive %} class="is-active"{% endif %}>
            <a href="{{ url }}"{% if subitems|length > 0 %} class="has-sub-menu"{% endif %}>{{ name|trans() }}</a>
            {% if subitems|length > 0 %}
                <ul class="main-sub-menu">
                    {% for name, url in subitems %}
                        {{ _self.menuItem(name, url) }}
                    {% endfor %}
                </ul>
            {% endif %}
        </li>
    {% endspaceless %}
{% endmacro %}

或对于包含子项的项目：

{{ _self.menuItem('FooBar', path('foo_foobar'), {
    'Foo': path('foo_baz', {slug: 'foo'}),
    "Bar": path('foo_baz', {slug: 'bar'}),
}) }}

---

很漂亮，不是吗？

在Silex中，我是这样做的：

$app->before(function ($request) use ($app) {
    $app['twig']->addGlobal('active', $request->get("_route"));
});

然后在我的Twig模板文件中，

{{{active}

等于当前路由

---

简单又容易

首先在模板中设置一个更好的可编辑变量

{% set page = app.request.get('_route') %}
<li class="nav-item">
            <a class="nav-link {% if page == 'welcome' %}active{% endif %}" href="{{ path('welcome') }}">Home <span class="sr-only">(current)</span></a>
        </li>

{%set page=app.request.get（''u route'）%}

以下是我使用的（用于Symfony 5）：

该尝试的问题是它加载了一个新页面。这不是ajax，你知道吗？如果你可以使用PHP或JS来确定url（假设页面有不同的url），那么你可以通过url值将所需的highlight类添加到相应的导航项中。是的，这就是我想要做的。该项目建立在一个名为symfony的框架之上，我想知道symfony是如何做到这一点的；）只有在真正需要的时候才使用这个框架，它可以让您的生活更轻松，其他情况下您可以使用普通的PHP或JS。但我想你可以随时查看框架的文档，看看你是如何获得url或当前正在使用的文件的。我不能附和你的建议“只有在真正需要的时候”如何使用这个框架。相反，尽可能多地利用您选择的框架！依赖于

request.get（“'u route'）

不是官方支持的，也不总是给您预期的结果。请参阅另一个问题：可能重复的

{{ _self.menuItem('FooBar', path('foo_foobar'), {
    'Foo': path('foo_baz', {slug: 'foo'}),
    "Bar": path('foo_baz', {slug: 'bar'}),
}) }}

$app->before(function ($request) use ($app) {
    $app['twig']->addGlobal('active', $request->get("_route"));
});

{% set page = app.request.get('_route') %}
<li class="nav-item">
            <a class="nav-link {% if page == 'welcome' %}active{% endif %}" href="{{ path('welcome') }}">Home <span class="sr-only">(current)</span></a>
        </li>

<li class="nav-item{% if (app.request.pathInfo == path('frontend_index')) %} active{% endif %}">