如何在 Yii CMenu 标签中添加原始 HTML答案

【问题标题】：How to add raw HTML in Yii CMenu label如何在 Yii CMenu 标签中添加原始 HTML
【发布时间】：2013-02-18 18:21:07
【问题描述】：

我使用 CMenu 小部件创建了一个类似于 Twitter Bootstrap 导航栏的菜单：

<?php 
    $this->widget( 'zii.widgets.CMenu', array(
    'items' => array(
        array(
            'label' => 'Home', 
            'url' => array( '/site/index' ), 
        ),
        array( 
            'label' => 'Dropdown <b class="caret"></b>', 
            'url' => '#',
            'submenuOptions' => array( 'class' => 'dropdown-menu' ),
            'items' => array( 
                array( 
                    'label' => 'Submenu Item 1', 
                    'url' => array( '/user/create' ), 
                ),
                array( 
                    'label' => 'Submenu Item 1', 
                    'url' => array( '/user/list' ), 
                ),
            ),
            'itemOptions' => array( 'class' => 'dropdown' ),
            'linkOptions' => array( 'class' => 'dropdown-toggle', 'data-toggle' => 'dropdown' ),
        ),
        'htmlOptions' => array( 'class' => 'nav' ),
    )); ?>

此代码生成包含 2 个项目的菜单和第二个菜单项的 1 个子菜单。美好的。但唯一没用的是第 9 行的'label' => 'Dropdown <b class="caret"></b>',。它在页面上呈现为Dropdown &lt;b class=&quot;caret&quot;&gt;&lt;/b&gt;。所以我看到标题 'Dropdown <b class="caret"></b>' 而不是 Dropdown ▼。

如何更改代码以在菜单标签中显示未转义的 HTML？

感谢您的关注。

【问题讨论】：

cniska.net/yii-bootstrap/#tbNavbar

标签： html yii cmenu

【解决方案1】：

你必须将CMenu的encodeLabel属性设置为false

<?php
$this->widget('zii.widgets.CMenu', array(
    'encodeLabel' => false,
    'htmlOptions' => array('class' => 'nav'),
    'items' => array(
        array(
            'label' => 'Home',
            'url' => array('/site/index'),
        ),
        array(
            'label' => 'Dropdown <b class="caret"></b>',
            'url' => '#',
            'submenuOptions' => array('class' => 'dropdown-menu'),
            'items' => array(
                array(
                    'label' => 'Submenu Item 1',
                    'url' => array('/user/create'),
                ),
                array(
                    'label' => 'Submenu Item 1',
                    'url' => array('/user/list'),
                ),
            ),
            'itemOptions' => array('class' => 'dropdown'),
            'linkOptions' => array('class' => 'dropdown-toggle', 'data-toggle' => 'dropdown'),
        ),
    ),
));
?>

【讨论】：

【解决方案2】：

我的解决方案是创建 CMenu 扩展：

layout/main.php

'submenuOptions'=>array('class'=>'dropdown-menu'),
'itemOptions'=>array('class'=>'dropdown'),
'linkOptions'=>array('class'=>'dropdown-toggle', 'data-toggle'=>'dropdown'),
// Dropdown arrow toggle
'dropdownArrow'=>true,

ext/widgets/BootstrapCMenu.php

class BootstrapCMenu extends CMenu {

protected function renderMenuItem($item)
{
    if(isset($item['url']))
    {
        $item['label'] .= ($item['dropdownArrow']) ? ' <b class="caret"></b>' : '';
        $label=$this->linkLabelWrapper===null ? $item['label'] : CHtml::tag($this->linkLabelWrapper, $this->linkLabelWrapperHtmlOptions, $item['label']);
        return CHtml::link($label,$item['url'],isset($item['linkOptions']) ? $item['linkOptions'] : array());
    }
    else
        return CHtml::tag('span',isset($item['linkOptions']) ? $item['linkOptions'] : array(), $item['label']);
}

}

【讨论】：

【解决方案3】：

在 Yii 2.0 中，要在导航栏菜单中添加字形图标，您可以按照以下信息进行操作。

在renderItem下的vendor\yiisoft\yii2-bootstrap\Nav.php中编辑如下代码：

     if(isset($item['icons']))
        $label=Html::tag('span', '', ['class' => 'glyphicon glyphicon-'.$item['icons']]).$label;

现在，您可以通过icons 选项直接使用代码中的任何图标

    <?php 
$this->widget( 'zii.widgets.CMenu', array(
'items' => array(
    array(
        'label' => 'Home', 
        'url' => array( '/site/index' ), 
        'icons'=> 'home',
    ),
    array( 
        'label' => 'Dropdown <b class="caret"></b>', 
        'url' => '#',
        'submenuOptions' => array( 'class' => 'dropdown-menu' ),
        'items' => array( 
            array( 
                'label' => 'Submenu Item 1', 
                'url' => array( '/user/create' ), 
            ),
            array( 
                'label' => 'Submenu Item 1', 
                'url' => array( '/user/list' ), 
            ),
        ),
        'itemOptions' => array( 'class' => 'dropdown' ),
        'linkOptions' => array( 'class' => 'dropdown-toggle', 'data-toggle' => 'dropdown' ),
    ),
    'htmlOptions' => array( 'class' => 'nav' ),
)); ?>

即使在旧版本的 yii 中，您也可以进行相应的更改。

【讨论】：