我正在开发角度管理员,以及我使用Angular Material sidenav的资源。
我可以使菜单工作50%,不能正常进行切换功能。
测试用例,在打开的切换菜单上单击几次:D
<header class="nav-header">
<a ng-href="#/" class="docs-logo">
<h1 class="docs-logotype md-heading">Angular Material</h1>
</a>
</header>
<ul class="skip-links">
<li class="md-whiteframe-z2">
<md-button ng-click="focusMainContent($event)" href="#">Skip to content</md-button>
</li>
</ul>
<md-content flex role="navigation">
<ul class="docs-menu">
<li ng-repeat="sectionmenu in menu.sections" class="parent-list-item {{sectionmenu.className || ''}}" ng-class="{'parentActive' : isSectionSelected(sectionmenu)}">
<h2 class="menu-heading md-subhead" ng-if="sectionmenu.type === 'heading'" id="heading_{{ sectionmenu.title | nospace }}">
{{sectionmenu.title}}
</h2>
<menu-link sectionmenu="sectionmenu" ng-if="sectionmenu.type === 'link'"></menu-link>
<menu-toggle sectionmenu="sectionmenu" ng-if="sectionmenu.type === 'toggle'"></menu-toggle>
</li>
</ul>
</md-content>
</md-sidenav>
关注问题Plunker:
http://embed.plnkr.co/fq3tonZoddSSZkyAaWD8/preview
Editable Plunker:
http://plnkr.co/edit/FQcZrwYlh4LPKuje9mLI?p=preview
更新并已解决:
在模板menu-toggle.tpl.html中,更改此内容:
<ul ng-show="isOpen()" id="menu-{{sectionmenu.title | nospace}}" class="menu-toggle-list">
<li ng-repeat="page in sectionmenu.pages">
<menu-link sectionmenu="page"></menu-link>
</li>
</ul>
为此:
<ul id="menu-{{sectionmenu.title | nospace}}" class="menu-toggle-list">
<li ng-repeat="page in sectionmenu.pages">
<menu-link sectionmenu="page"></menu-link>
</li>
</ul>