Angular Material 未锁定边栏
Angular Material Not Locked sidebar
我有这样的侧边栏：
按钮 1
按钮 2
此入门应用程序由工具栏、SideNav（带有两个按钮）和内容区域组成。
这是内容区！
当前行为 - 当我远程控制 md-is-locked-open 属性并在用户单击按钮时开始显示边栏时，边栏是全屏的而不是在内部内容区。
所以它与锁定版本有以下几点不同：
- 它在工具栏上方
- 主要内容变灰
- 超出内容区域
必需的行为 - 我必须更改什么才能将其包含在内容区域中？所以它看起来和锁定时完全一样。
- 应该在工具栏下面
- 不应与主要内容重叠（将其向右移动即可=
- 不应使其他内容变灰
Codepen Here
只需更改：
<div layout="row" flex>
在 sidenav 上方：
<md-content layout="row" flex>
和相应的结束标记。就是这样！
md-toolbar 必须与 md-content 同级才能获得您正在寻找的行为。
编辑
如需进一步的要求，请查看我制作的这个 Codepen。它完全符合您的要求（覆盖 sidenav 行为以隐藏叠加层并将内容推到右侧）：http://codepen.io/anon/pen/pjXYMa
我有这样的侧边栏：
这是内容区！
当前行为 - 当我远程控制 md-is-locked-open 属性并在用户单击按钮时开始显示边栏时，边栏是全屏的而不是在内部内容区。
- 它在工具栏上方
- 主要内容变灰
- 超出内容区域
必需的行为 - 我必须更改什么才能将其包含在内容区域中？所以它看起来和锁定时完全一样。
- 应该在工具栏下面
- 不应与主要内容重叠（将其向右移动即可=
- 不应使其他内容变灰
Codepen Here
只需更改：
<div layout="row" flex>
在 sidenav 上方：
<md-content layout="row" flex>
和相应的结束标记。就是这样！
md-toolbar 必须与 md-content 同级才能获得您正在寻找的行为。
编辑
如需进一步的要求，请查看我制作的这个 Codepen。它完全符合您的要求（覆盖 sidenav 行为以隐藏叠加层并将内容推到右侧）：http://codepen.io/anon/pen/pjXYMa