Question

我在Angular 4应用程序中使用AdminLTE。

我在左侧菜单上有链接，我使用了data-widget =＆＃34; tree＆＃34;显示左侧菜单。

打开时看起来像这样：

当它关闭时就像这样：

我希望菜单在加载页面时默认打开，我无法在documentation

中找到相应的选项

我能想到的一个解决方案是在组件初始化时触发组件的点击，但我不知道如何实现这一点，因为我无法动态生成template reference variables.

Answer 1

我也遇到了问题。并在这里找到答案。

https://stackoverflow.com/a/46256226/7353073

希望对你也有用。

Answer 2

我知道这是一个老问题，但是我有同样的问题。我尝试了许多提供的解决方案，但没有一个对我有用。也许是因为我切换到AdminLTE 2.4.x，现在基于javascript的解决方案不再起作用了。

这是一种仅基于CSS和对HTML代码进行一些操作的简单方法。但它会在加载时打开特定的Treeview菜单，并保留tree.js插件的功能。

首先：提供一个像这样的新自定义CSS类...

.treeview-menu-visible {
    display: block;
}

第二：像这样操作HTML模板...

您必须将类“ menu-open”添加到“ treeview”列表元素和“ treeview-menu”列表中。然后，将自定义CSS类另外添加到“ treeview-menu”列表中。

<ul class="sidebar-menu" data-widget="tree">
    <li class="header">Headline</li>
        <li class="treeview menu-open">
            <a href="#">
                <i class="fa fa-search"></i><span>Search</span>
                <span class="pull-right-container">
                    <i class="fa fa-angle-left pull-right"></i>
                </span>
            </a>
            <ul class="treeview-menu menu-open treeview-menu-visible">
                <li><a href="#"><i class="fa fa-user"></i> Example</a></li>
                <li><a href="#"><i class="fa fa-lock"></i> Example</a></li>
            </ul>
        </li>
    </li>
</ul>

此方法的优点是您可以选择要在加载时打开的特定子菜单，而许多其他解决方案可以一次打开所有子菜单。希望这可以帮助某人...

AdminLTE - data-widget =＆＃34; tree＆＃34; - 默认打开菜单

2 个答案: