angular/material2 .md-sidenav-内容宽度 100%

Question

是否可以让 sidenav 内容在 angular/material2 中占满宽度？如果您遵循网站上的教程，您可以这样定义您的内容：

<md-sidenav-container>
  <md-sidenav>
    <!-- sidenav content -->
  </md-sidenav>

  <!-- primary content -->
</md-sidenav-container>

但他们真正做的是添加一个 <div class="md-sidenav-content" ...> 包裹 "primary content" 的元素。

是否可以给那个元素一个width:100%？或者更好的是 flex: 1 1 100%; 样式？只是在 css 中添加 .md-sidenav-content class 似乎不起作用...

Answer 1

有可能。您只需要在 md-sidenav 元素上添加宽度：100%。

<md-sidenav #sideNav style="width: 100%"></md-sidenav>

Answer 2

没关系。我找到了解决方案。我在 <md-sidenav-container> 元素上有一个 display: flex;。删除它就可以了。

angular/material2 .md-sidenav-content width 100%