如何自定义Angular Material Sidenav组件？

Question

我正在使用Angular 4和Angular Material建立聊天，我正在尝试在sidenav上显示一些信息。我正在使用Angular Material的sidenav，但我愿意自定义样式并摆脱sidenav打开时出现的阴影。

在styles.css文件中我尝试了这个：

.mat-sidenav-transition .mat-sidenav-backdrop.mat-sidenav-shown {
    transition: background-color .4s cubic-bezier(.01,.1,.25,1); 
    background-color: transparent;

}
.mat-sidenav-backdrop.mat-sidenav-shown {
    background-color: transparent;
}

我也尝试使用::ng-deep，但它不会工作。

Answer 1

您可以使用mode="side"，但不会创建背景幕。

<md-sidenav mode="side" opened="true">Drawer content</md-sidenav>

请参阅docs