Angular Material sidenav问题

时间:2015-07-17 17:05:24

标签: angularjs angular-material

我正在开发角度管理员,以及我使用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>

0 个答案:

没有答案