KnpMenuBundle - 如何為菜單的每個元素設置一個圖標類？

Question

我希望我的視圖代碼看起來像這樣：

<li>
    <a href="path/to/action">
            <i class="icon-class"></i>
            <span class="title">Title</span>
    </a>
</li>

我通過Menu Builder創建菜單元素：

class Builder extends ContainerAware
{
    public function adminMenu(FactoryInterface $factory, array $options)
    {
        $menu = $factory->createItem('root');

        $menu->addChild('Dashboard', array(
            'route' => 'admin_dashboard',
        ));

        return $menu;
    }
}

我用以下代碼覆蓋了視圖（knp_menu.html.twig）：

{% block linkElement %}
    {% import _self as knp_menu %}
    <a href="{{ item.uri }}"{{ knp_menu.attributes(item.linkAttributes) }}>
        <i class="icon-class"></i>
        <span class="title">{{ block('label') }}</span>
    </a>
{% endblock %}

如何在Builder類中的方法adminMenu（）中將圖標類名的值傳遞給<i>元素？ 最簡單的方法是什么？

Answer 1

您可以添加所需的任何屬性

$menu->addChild('Dashboard', array(
    'route' => 'admin_dashboard',
))->setAttribute('icon', 'icon-class');

然后

{{ item.attribute('icon') }}

Answer 2

我建議使用extras而不是attributes ，因為attributes用於呈現li元素的屬性。

$menu->addChild('Dashboard', array(
    'uri' => '#',
))->setAttribute('icon', 'icon-class');

和

{{ item.attribute('icon') }}

可能會呈現為：

<li icon="icon-class"><a href="#"><i class="fa fa-icon-class" aria-hidden="true"></i> Dashboard</a></li>

鑒於：

$menu->addChild('Dashboard', array(
    'uri' => '#',
))->setExtra('icon', 'icon-class');

和

{{ item.extra('icon') }}

可能只會呈現為：

<li><a href="#"><i class="fa fa-icon-class" aria-hidden="true"></i> Dashboard</a></li>

另請參閱此答案： https ： //stackoverflow.com/a/19095287/2106834 。

Answer 3

只是：

$menu->addChild('Home', ['route' => 'home_page'])
        ->setAttribute('icon', 'fa fa-home');