我需要这个
这是 Controller 代码:
$scope.sideNavMenu =
{
title: "User Manual",
subMenu: [
{
title: "Title one",
link: "index/titleone.html",
icon:"fa fa-caret-down",
subMenu: []
},
{
title: "Basic",
link: "index/basic/basic.html",
icon:"fa fa-caret-down",
subMenu: [
{
title: "Basic Function",
link: "index/basic/function.html",
icon:"fa fa-caret-down",
subMenu: []
}]
}]
};
我已经花了两个星期的时间来解决这个问题。请问有人可以帮助我吗?
就这样吧
<div id="MainMenu">
<div class="list-group panel">
<a href="#mainMenuContainer" class="list-group-item list-group-item-success strong" data-toggle="collapse" data-parent="#MainMenu">
<i class="fa fa-home"></i>
{{sideNavMenu.title}}
<i class="fa fa-caret-down"></i>
</a>
<div ng-include ng-if="sideNavMenu.subMenu.length > 0" ng-repeat="navMenu in sideNavMenu.subMenu" onload="data = navMenu" src="'menuTemplate.html'"class="collapse" id="mainMenuContainer">
</div>
</div>
模板
<script id="menuTemplate.html" type="text/ng-template">
<a ng-href="#{{ (data.subMenu.length > 0) && data.link || ''}}" class="list-group-item {{(data.subMenu.length > 0) && 'strong' || ''}}" data-toggle="collapse" data-parent="{{data.link}}">{{data.title}}<i class="fa fa-caret-down"></i></a>
<div ng-include ng-repeat="navMenu in data.subMenu" onload="data = navMenu" src="'menuTemplate.html'" class="list-group-submenu" ng-if="data.subMenu.length > 0" ng-attr-id="{{data.link}}">
</div>
</script>
here an example that i use to understand
这是结果
当我点击什么都没发生
控制台:语法错误,无法识别的表达式:index/titleone.html
最佳答案
您的菜单基本上只是一堆嵌套列表;看了之后 this post ,我能够采用您的 subMenu 数据结构并对其进行调整以生成一个简单的列表:
HTML
<div ng-app>
<script type="text/ng-template" id="menu-renderer">
{{item.title}}
<ul ng-if="item.subMenu && item.subMenu.length > 0">
<li ng-repeat="item in item.subMenu" ng-include="'menu-renderer'"></li>
</ul>
</script>
<div ng-controller="MenuCtrl">
<ul>
<li ng-repeat="item in subMenu" ng-include="'menu-renderer'"></li>
</ul>
</div>
</div>
Javascript
function MenuCtrl($scope) {
$scope.subMenu = [
{
title: "User Manual",
subMenu: [
{
title: "Title one",
link: "index/titleone.html",
icon:"fa fa-caret-down",
subMenu: []
},
{
title: "Basic",
link: "index/basic/basic.html",
icon:"fa fa-caret-down",
subMenu: [
{
title: "Basic Function",
link: "index/basic/function.html",
icon:"fa fa-caret-down",
subMenu: []
}]
}]
}];
}
我有this fiddle如果你想看到它的实际效果。
这有帮助吗?
关于javascript - Ionic、angularjs、bootstrap 3 的左侧多级菜单无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24816322/
我在从html页面生成PDF时遇到问题。我正在使用PDFkit。在安装它的过程中,我注意到我需要wkhtmltopdf。所以我也安装了它。我做了PDFkit的文档所说的一切......现在我在尝试加载PDF时遇到了这个错误。这里是错误:commandfailed:"/usr/local/bin/wkhtmltopdf""--margin-right""0.75in""--page-size""Letter""--margin-top""0.75in""--margin-bottom""0.75in""--encoding""UTF-8""--margin-left""0.75in""-
我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗?当我运行compasswatch时,它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行?文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们?我自己编译的.sass文件编译成compiled/t
我对最新版本的Rails有疑问。我创建了一个新应用程序(railsnewMyProject),但我没有脚本/生成,只有脚本/rails,当我输入ruby./script/railsgeneratepluginmy_plugin"Couldnotfindgeneratorplugin.".你知道如何生成插件模板吗?没有这个命令可以创建插件吗?PS:我正在使用Rails3.2.1和ruby1.8.7[universal-darwin11.0] 最佳答案 随着Rails3.2.0的发布,插件生成器已经被移除。查看变更日志here.现在
我有一个ModularSinatra应用程序,我正在尝试将Bootstrap添加到应用程序中。get'/bootstrap/application.css'doless:"bootstrap/bootstrap"end我在views/bootstrap中有所有less文件,包括bootstrap.less。我收到这个错误:Less::ParseErrorat/bootstrap/application.css'reset.less'wasn'tfound.Bootstrap.less的第一行是://CSSReset@import"reset.less";我尝试了所有不同的路径格式,但它
我尝试运行2.x应用程序。我使用rvm并为此应用程序设置其他版本的ruby:$rvmuseree-1.8.7-head我尝试运行服务器,然后出现很多错误:$script/serverNOTE:Gem.source_indexisdeprecated,useSpecification.Itwillberemovedonorafter2011-11-01.Gem.source_indexcalledfrom/Users/serg/rails_projects_terminal/work_proj/spohelp/config/../vendor/rails/railties/lib/r
我正在尝试在我的centos服务器上安装therubyracer,但遇到了麻烦。$geminstalltherubyracerBuildingnativeextensions.Thiscouldtakeawhile...ERROR:Errorinstallingtherubyracer:ERROR:Failedtobuildgemnativeextension./usr/local/rvm/rubies/ruby-1.9.3-p125/bin/rubyextconf.rbcheckingformain()in-lpthread...yescheckingforv8.h...no***e
我花了三天的时间用头撞墙,试图弄清楚为什么简单的“rake”不能通过我的规范文件。如果您遇到这种情况:任何文件夹路径中都不要有空格!。严重地。事实上,从现在开始,您命名的任何内容都没有空格。这是我的控制台输出:(在/Users/*****/Desktop/LearningRuby/learn_ruby)$rake/Users/*******/Desktop/LearningRuby/learn_ruby/00_hello/hello_spec.rb:116:in`require':cannotloadsuchfile--hello(LoadError) 最佳
关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗?通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion在首页我有:汽车:VolvoSaabMercedesAudistatic_pages_spec.rb中的测试代码:it"shouldhavetherightselect"dovisithome_pathit{shouldhave_select('cars',:options=>['volvo','saab','mercedes','audi'])}end响应是rspec./spec/request
在Rails4.0.2中,我使用s3_direct_upload和aws-sdkgems直接为s3存储桶上传文件。在开发环境中它工作正常,但在生产环境中它会抛出如下错误,ActionView::Template::Error(noimplicitconversionofnilintoString)在View中,create_cv_url,:id=>"s3_uploader",:key=>"cv_uploads/{unique_id}/${filename}",:key_starts_with=>"cv_uploads/",:callback_param=>"cv[direct_uplo
我在pry中定义了一个函数:to_s,但我无法调用它。这个方法去哪里了,怎么调用?pry(main)>defto_spry(main)*'hello'pry(main)*endpry(main)>to_s=>"main"我的ruby版本是2.1.2看了一些答案和搜索后,我认为我得到了正确的答案:这个方法用在什么地方?在irb或pry中定义方法时,会转到Object.instance_methods[1]pry(main)>defto_s[1]pry(main)*'hello'[1]pry(main)*end=>:to_s[2]pry(main)>defhello[2]pry(main)