我正在尝试使用 Angular Material sidenav。一切都按预期工作,但侧导航正在滑过标题。我该如何解决这个问题?我创建了一个 Planker 以便能够查看我的代码,但是 Planker 没有按预期工作。预先感谢您的帮助。 https://plnkr.co/edit/gr5n1AbBHADWY4L72MMg?p=preview
这是我代码的一部分,其余部分可以在 Plunker 中看到
<div>
<md-toolbar class="md-accent">
<div class="md-toolbar-tools">
<h2>Logo here</h2>
</div>
</md-toolbar>
</div>
<div ng-controller="AdminController as ctrl" class="md-content" ng-cloak>
<section layout="row" flex>
<md-sidenav class="md-sidenav-left" md-component-id="left"
md-disable-backdrop md-whiteframe="4">
<md-content layout-margin>
<md-button ng-click="toggleLeft()" class="md-accent">
Close this Sidenav
</md-button>
</md-content>
</md-sidenav>
<md-content flex layout-padding>
<div layout="column">
<div>
<md-button ng-click="toggleLeft()" class="md-raised">
Toggle Sidenav
</md-button>
</div>
</div>
</md-content>
</section>
</div>
最佳答案
将 md 按钮放在外面
<section layout="row" flex>
<md-content flex layout-padding>
<md-toolbar class="md-theme-indigo">
<h2>Logo here</h2>
</md-toolbar>
<md-button ng-click="clickSide('left')"> Toggle Sidenav</md-button>
</md-content>
<md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="left">
<md-toolbar class="md-theme-light">
<h1 class="md-toolbar-tools">Sidenav left</h1>
</md-toolbar>
<md-content layout-padding="">
<md-tabs>
</md-tabs>
</md-content>
</md-sidenav>
</section>
编辑:
将 SideNav 和内容嵌入 <md-content flex></md-content>
<强> DEMO
关于javascript - 标题下的 Angular Material sidenav,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40318861/