使用 KnpMenuBundle 和 Bootstrap 3 的下拉菜单

Question

我刚刚将 KnpMenuBundle 添加到我的 Symfony 项目中。我还添加了 Bootstrap 以使其看起来更好。

现在我想创建一个子菜单或下拉菜单。有没有一个简单的例子/方法如何做到这一点？我搜索了很多示例，但它们要么需要额外的捆绑包，要么不起作用

更新

我需要知道如何将属性添加到我的菜单子项以便使用 bootstrap

呈现它

此致

奥利弗

Answer 1

这很简单。有关属性，请参阅 KnpMenu docs.

一个例子：

base.html.twig，出现在模板中 {% extends "base.html.twig" %}:

...
        {% block stylesheets %}
            <link href="{{ asset('css/bootstrap.css') }}" rel="stylesheet" media="all">
            <link href="{{ asset('css/pdf.css') }}" rel="stylesheet" media="all">
            <link href="{{ asset('css/jquery-ui.min.css') }}" rel="stylesheet" media="all" />
        {% endblock %}
...
    {% block nav %}
        {% spaceless %}
            <nav class="navbar navbar-default">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#"></a>
                </div>
                <div class="collapse navbar-collapse navbar-ex1-collapse">
                    {{ knp_menu_render('AppBundle:Builder:mainMenu', {'style': 'navbar'})  }}
                    {{ knp_menu_render('AppBundle:Builder:logoutMenu', { 'style': 'navbar-right' })  }}
                </div>
            </nav>
        {% endspaceless %}
    {% endblock nav %}
...
        {% block javascripts %}
            <script
                src="https://code.jquery.com/jquery-1.11.3.js"
                integrity="sha256-IGWuzKD7mwVnNY01LtXxq3L84Tm/RJtNCYBfXZw3Je0="
            crossorigin="anonymous"></script>
            <script src="{{ asset('js/bootstrap.js') }}"></script>
            <script src="{{ asset('js/jquery-ui.min.js') }}"></script>
            <script src="{{ asset('js/project.js') }}"></script>
        {% endblock %}

Builder.php:

    ...
    class Builder implements ContainerAwareInterface
    {
        use ContainerAwareTrait;

        public function mainMenu(FactoryInterface $factory, array $options)
        {
            $checker = $this->container->get('security.authorization_checker');

            $menu = $factory->createItem('root');

            $menu->addChild('Home', array('route' => 'homepage'));

            $menu->addChild('Receipt');
            $menu['Receipt']->addChild('Add receipt', [
                'route' => 'receipt_add'
            ]);
            $menu['Receipt']->addChild('Edit receipt', [
                'route' => 'receipt_edit'
            ]);

            $menu->addChild('Artist');
            $menu['Artist']->addChild('Add artist', [
                'route' => 'artist_add'
            ]);
            $menu['Artist']->addChild('Edit artist', [
                'route' => 'artist_edit'
            ]);
            $menu['Artist']->addChild('Add existing to show', [
                'route' => 'existing_artists'
            ]);

            $menu->addChild('Tickets');
            $menu['Tickets']->addChild('Add block', [
                'route' => 'block_add'
            ]);
            $menu['Tickets']->addChild('Edit block', [
                'route' => 'block_edit'
            ]);


            $menu->addChild('Show');
            $menu['Show']->addChild('Add show', [
                'route' => 'show_add'
            ]);
            $menu['Show']->addChild('Edit show', [
                'route' => 'show_edit'
            ]);

            $menu->addChild('Reports', [
                'route' => 'reports'
            ]);

            if ($checker->isGranted('ROLE_ADMIN')) {
                $menu->addChild('Admin');
                $menu['Admin']->addChild('Ticket block reassign', [
                    'route' => 'block_reassign'
                ]);
                $menu['Admin']->addChild('Users', [
                    'route' => 'easyadmin'
                ]);
                $menu['Admin']->addChild('Delete artist', [
                    'route' => 'artist_delete'
                ]);
            }

            return $menu;
        }
...

使用 KnpMenuBundle 和 Bootstrap 3 的下拉菜单

Dropdown Menus with KnpMenuBundle and Bootstrap 3

symfony

knpmenubundle

twitter-bootstrap-3