为什么angular material select会溢出屏幕 [英] Why angular material select is overflowing the screen
本文介绍了为什么angular material select会溢出屏幕的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在我的应用程序中使用了角度材质选择,您可以在此处找到
解决方案
您可以覆盖分页器面板的默认 css 以将其放置在屏幕上的任何位置:
::ng-deep .mat-select-panel {位置:固定;底部:0;左:0;高度:300px;宽度:100%;}
根据要放置元素的位置更改类的属性.
I am using angular material select in my application which you can find here https://material.angular.io/components/select/overview. The problem is when we place the select near the bottom of the screen it, and when it is opened, It overflow the screen. This is the screenshot of what I am experiencing. What kind of css is needed to prevant this from happening.
<mat-select style="margin-bottom: 0px;" placeholder="{{input1.title}}" >
<mat-option>None</mat-option>
<mat-option *ngFor="let opt_value of input1.enumNameGroups[grp_value] let i = index" value="{{input1.enumidGroups[grp_value][i]}}" >{{opt_value}}</mat-option>
</mat-optgroup>
</mat-select>
解决方案
You can override the default css of the paginator panel to place it anywhere on the screen:
::ng-deep .mat-select-panel {
position: fixed;
bottom: 0;
left: 0;
height: 300px;
width: 100%;
}
Change the properties of the class depending on where you want to place the element.
这篇关于为什么angular material select会溢出屏幕的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文