上下文: 我在一个屏幕上工作，我需要使用一个垫子抽屉，垫子抽屉将显示一个自定义组件.但是，定制组件嵌套在一个div中(使用class="mat-draer-ner-tainer")，并且这个div是由mat-draer组件自动添加的. 这是我的父屏幕的html组件的 struct (我从这里打开抽屉)
<mat-drawer>
<custom-component-directive></custom-component-directive>
</mat-drawer>
在按Angular 添加div之后(如Chrome dev工具中所示)
<mat-drawer>
<div class="mat-drawer-inner-container">
<custom-component-directive></custom-component-directive>
</div>
</mat-drawer>
问题是，div还为整个组件添加了一个滚动条(滚动条没有用，因为它不能根据表中的条目数量移动，并且无论条目的数量如何都保持不变)，我已经从它内部向定制组件的table添加了我自己的虚拟滚动条.这最终会添加两个滚动条.
The whole thing ends up looking like this:
Real content not disclosed in the image (markers applied)
在使用Chrome开发工具进行实验后，我发现，如果我将overflow-y: hidden样式应用于生成的.mat-drawer-inner-container div，滚动条就会像预期的那样隐藏起来.
在实际组件中实际应用这一点.到目前为止，我试着做了以下几件事，但都没有成功:
- try 使用链接到
parent组件的css访问mat-drawer-inner-container
.mat-drawer .mat-drawer-inner-container {
overflow-y: hidden;
}
- try 使用自定义组件的CSS中的
:host伪 Select 器访问该自定义组件指令的父元素
:host .mat-drawer-inner-container {
overflow-y: hidden;
}
- 我try 将样式作为
!important传递，以使其在第1部分和第2部分中都优先. - 甚至使用内联样式作为绝望的最后手段.
我是一个CSS和造型新手一般，感谢任何帮助和建议.