角材料如何将mat-sidenav放置在顶部或底部

Question

我是棱角材料的新手。从有角度的材料文档中，我可以看到它可以定位为“开始”或“结束”。

<div style="border:solid 1px red;">
    <mat-sidenav-container>
        <mat-sidenav class="sidenav"
                     position="end" <!-- want to position top or bottom here-->
                     [opened]="sidenavOption.open"
                     [mode]="sidenavOption.mode">
            Sidenav content
        </mat-sidenav>
        <ng-content></ng-content>
    </mat-sidenav-container>
</div>

我想定位在“顶部”或“底部”

有人可以帮我怎么做吗？

谢谢

Answer 1

AFAIK顾名思义，sidenav只能出现在页面的右侧（end）或左侧（start）。即使材料设计规范允许使用底部抽屉（here）。

如here所述，除了position之外没有其他属性可以指定左侧或右侧以外的位置。

似乎您可能需要自己制作这样的抽屉-但为此您可以从材料设计类扩展并在它们之上构建-或可以使用MatBottomSheet，这几乎相同，但只能用作一种底部抽屉。