如何确保组件填充 html/angular 中可用的 space
How to make sure a component fills the available space in html/angular
我有一个 angular 应用程序,angular 应用程序有一个 header、一个侧边菜单和一个主要内容。
我正在努力让这个“主要内容”占据全部可用高度。
这很重要,因为在这个视图中我有一个浮动操作按钮需要位于 bottom-right.
我在这里重现了这个问题:https://stackblitz.com/edit/sidenav-height-issue?
我试过在几个地方将高度设置为 100%,但没有成功。我该怎么办?
谢谢!
您需要将 sidenav 容器的 height
设置为 100%
<mat-sidenav-container style="height: 100%;">
<!-- <mat-sidenav #sidenav role="navigation">
</mat-sidenav-container>
我有一个 angular 应用程序,angular 应用程序有一个 header、一个侧边菜单和一个主要内容。 我正在努力让这个“主要内容”占据全部可用高度。 这很重要,因为在这个视图中我有一个浮动操作按钮需要位于 bottom-right.
我在这里重现了这个问题:https://stackblitz.com/edit/sidenav-height-issue?
我试过在几个地方将高度设置为 100%,但没有成功。我该怎么办?
谢谢!
您需要将 sidenav 容器的 height
设置为 100%
<mat-sidenav-container style="height: 100%;">
<!-- <mat-sidenav #sidenav role="navigation">
</mat-sidenav-container>