3

默认情况下 mat-drawer-container/mat-sidenav-container和mat-drawer/mat-sidenav高度基于mat-drawer-content/mat-sidenav-content，但我想设置mat-drawer高度基于它自己的内容和mat-drawer-container高度根据mat-drawer或mat-drawer-content中的哪一个来设置。我的垫子抽屉内容将根据用户输入动态变化，有没有直接的方法可以在有角度的材料中做到这一点？

下面的链接是一个演示应用程序，更加清晰。

i）当我使用 height:100vh 时，我通过滚动条获得全视图高度（这并不有趣）。

ii）如果我使用 host:mat-drawer-container:100px 它不接受 fit-content 或 100% 作为值并且不接受 max-height:500px。

iii) 试过 { provide: MAT_DRAWER_DEFAULT_AUTOSIZE, useValue: { autosize: true } } 但当 mat-drawer-content 为空并且 mat-drawer 中有一个项目列表时，垫子抽屉不可见。

https://stackblitz.com/edit/angular-mat-drawer-s1vgwr？

4

1 回答 1

1

从跟随开始！

<mat-drawer fxFlex #drawer mode="side"
        style="display: inline-table; overflow: auto; position: fixed; margin-top: 75px">

不断调整，直到满足您的要求。最简单的测试方法是使用浏览器开发工具并从那里调整 css。这是我为一个项目所遵循的，也想知道其他人的想法。

于 2020-10-23T15:12:27.003 回答