2015-01-02 1 views
4

Я хочу, чтобы мой взгляд, код выглядит следующим образом:KnpMenuBundle - как я могу настроить класс значков для каждого элемента меню?

<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 %} 

Как передать значение имени класса значка в <i> элемент в методе adminMenu(), в классе Builder? Какой самый простой способ сделать это?

ответ

7

Вы можете добавить любой атрибут вы хотите с

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

затем

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

Большое спасибо! :) – klapaucius

0

Просто:

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

Большое спасибо !!! – klapaucius

2

Я бы предложил использовать extras вместо attributes, потому что attributes используется для визуализации элемента li ttributes.

$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.

Смежные вопросы