Как правильно динамически сформировать linkTemplate для Menu::widget?

Question

[Владимир]

Всем привет!

Мне нужно привести список ссылок в меню к такому виду:

<li><a href="#" data-nav-section="testimonials"><span>Отзывы</span></a></li>
<li><a href="#" data-nav-section="services"><span>Услуги</span></a></li>
<li><a href="#" data-nav-section="about"><span>О компании</span></a></li>

Я делаю вот так:

$menuItems = [
        ['label' => 'Отзывы', 'url' => ['/'], 'tag' => 'testimonials'],
        ['label' => 'Услуги', 'url' => ['/'], 'tag' => 'services'],
        ['label' => 'О компании', 'url' => ['/'], 'tag' => 'about'],
    ];

    echo Menu::widget([
        'options' => [
            'class' => 'nav navbar-nav navbar-right text-center'
            ],
        'items' => $menuItems,
        'linkTemplate' => '<a href="{url}" data-nav-section=""><span>{label}</span></a>',
    ]);

Пробовал записывать и массив якорей в переменную и передавать linkTemplate массивом, но все никак...
Подскажите, как получить такой результат?
data-nav-section="$anchor"

Answer 1

[Максим Федоров]

в Вашем случае вижу вариант использования только template для каждого пункта меню, например:

$menuItems = [
    ['label' => 'Отзывы', 'url' => ['/'], 'template' => '<a href="{url}" data-nav-section="testimonials"><span>{label}</span></a>'],
    ['label' => 'Услуги', 'url' => ['/'],  'template' => '<a href="{url}" data-nav-section="services"><span>{label}</span></a>'],
    ['label' => 'О компании', 'url' => ['/'], 'template' => '<a href="{url}" data-nav-section="about"><span>{label}</span></a>'],
];

Comments

[Владимир]

как ни странно, перепробовав куча вариантов с переменными, такой самый логичный способ даже в голову не пришел. Спасибо!

Answer 2

[Максим Тимофеев]

Можно просто html использовать, а можно написать свой виджет на базе Menu.
А можно попробовать так:

echo Menu::widget([
        'options' => [
            'class' => 'nav navbar-nav navbar-right text-center'
            ],
        'items' => [
['label' => 'Отзывы1', 'url' => ['/'], 'options'=>['data-nav-section'=>'someValue1'],
['label' => 'Отзывы2', 'url' => ['/'], 'options'=>['data-nav-section'=>'someValue2'],
['label' => 'Отзывы3', 'url' => ['/'], 'options'=>['data-nav-section'=>'someValue3'],
],
        'linkTemplate' => '<a href="{url}" data-nav-section=""><span>{label}</span></a>',
    ]);

Comments

[Владимир]

В данном случае html получается такого вида:
[li data-nav-section="someValue2"][a href="/"][span>Отзывы2[/span][/a][/li]

[Максим Тимофеев]

Владимир: Ну так это Вам должно подойти, просто js подправить где дата атрибуты используются, например:

$('a').on('click',function(){
var mydata = $(this).closest('li').attr('data-nav-section');
console.log(mydata);
});

[Владимир]

Да, если так, то можно