- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用?
- database - RESTful URI 是否应该公开数据库主键?
我对 Jquerymetis 菜单有疑问。我想从数据库加载菜单元素,我正在使用 AngujarJS Controller 获取带有菜单元素的 JSON。
这里是 AngularJSController
var appControllers = angular.module('appControllers', []);
appControllers.controller('MenuCtrl', ['$scope', '$http',
function ($scope, $http) {
var url = "/api/Menus/GetMenuElements";
$http.post(url).
success(function (data, status, headers, config) {
$scope.menuElements = data;
console.log("Success");
}).
error(function (data, status, headers, config) {
console.log("Error");
});
}]);
然后在我的 ASP.NET MVC 项目的 PartialView 中,我使用 Angular 指令将元素添加到菜单。
<ul class="nav" id="side-menu">
<li ng-repeat="elementL1 in menuElements" ng-init="menuElements != null">
<a ng-if="elementL1.LINK !== null" href="{{elementL1.LINK}}"><i class="fa fa-home"></i> <span class="nav-label">{{elementL1.NAME}}</span><span class="fa arrow"></span></a>
<a ng-if="elementL1.LINK == null"><i class="fa fa-home"></i> <span class="nav-label">{{elementL1.NAME}}</span> </a>
<ul ng-repeat="elementL2 in elementL1.ChildMenu" ng-if="elementL1.ChildMenu.length > 0" class="nav nav-second-level">
<li class="primerLi">
<a>{{elementL2.NAME}}<span class="fa arrow"></span></a>
<ul ng-if="elementL2.ChildMenu.length > 0" class="nav nav-third-level">
<li ng-repeat="elementL3 in elementL2.ChildMenu">
<a href="{{elementL3.LINK}}">{{elementL3.NAME}}</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
这可以很好地向菜单添加元素,但无法折叠和展开。它看起来展开了,我无法折叠元素。
我认为问题是我必须在加载元素后调用 $('#side-menu').metisMenu();
但如果我在浏览器控制台上调用它,它不会'不工作。
如何实现?我是 Angular 的新手。在这里我看到了同样的问题,但我无法解决问题。 https://github.com/onokumus/metisMenu/issues/22
编辑
我发现不能多次调用 Metis 菜单。我已经从 onready 事件 JS 中删除了 $('#side-menu').metisMenu();
并且我从浏览器控制台调用了它,它现在可以工作了。
现在我需要帮助,以便在加载菜单元素时使用 angular 调用它。我是 Angular 的新手,我需要一些帮助。
最佳答案
我已经解决了当 ng-repeat 的最后一个元素呈现给 DOM 时使用 Angular 指令执行 metisMenu 函数的问题。
app.directive('metis', function ($timeout) {
return function ($scope, $element, $attrs) {
if ($scope.$last == true) {
$timeout(function () {
$('#side-menu').metisMenu();
}, 250)
}
};
});
然后我必须在 Ng 重复元素上使用指令
<li ng-repeat="elementL1 in menuElements" ng-init="menuElements != null" metis="">
您可以在我的问题上看到完整的 HTML 代码。
我是 Angular 的新手,所以我不是专家。甚至我希望这个解决方案可以帮助某人。
关于javascript - jquery metismenu 无法与 AngularJS Controller 异步加载数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34026478/
我正在使用 MetisMenu,当我在第三层菜单项上有一个链接时,一旦单击该链接,父菜单项就会全部折叠。 二级菜单 item 链接工作正常。 我的示例代码在这里:
我目前正在尝试使用 MetisMenu 制作下拉菜单 https://github.com/onokumus/metisMenu . 这是我到目前为止所拥有的(它是一个动画 .gif)。 如您所见,当
我正在使用 metisMenu对于管理员面板。我想让我的侧边栏菜单在鼠标悬停时自动扩展,速度平稳。我正在使用免费软件 advance admin template通过二进制主题。我已经使用以下 CSS
我正在尝试更改 metisMenu 的默认行为,以便如果父菜单有链接,则在用户单击该链接时打开链接,否则在用户单击 HOME ABOUT US CATEGORY P
我将以下 Bootstrap 导航侧边栏与 metisMenu jquery 库一起使用: Dashboard
我是 VueJs 的新学生,我想在其中制作一个菜单和一个二级菜单。我想使用 Jquery-MetisMenu,所以我下载了它,将它放在我的 Index.html 上,然后我制作了一个菜单 View 的
我想使用ng-include来渲染template的侧边栏。该模板需要jQuery metisMenu 插件作为下拉菜单。 问题:只有当我在部分模板“sidebar.html”中加载以下脚本时,插件才
在此页 http://jolaga.laohost.net/topsleva我使用 metisMenu 在左侧切换类别。除了一个小异常(exception),它工作得很好。在 IE8/9 中,如果我单
我对 Jquerymetis 菜单有疑问。我想从数据库加载菜单元素,我正在使用 AngujarJS Controller 获取带有菜单元素的 JSON。 这里是 AngularJSController
我是一名优秀的程序员,十分优秀!