Angular material 角度材质选择(mat Select)在全屏模式下进行角度谷歌贴图时不显示
我使用的是角度材质和角度谷歌地图。我在时髦的信息窗口中有一个有角度的材质窗体,它在正常模式下工作良好。它很好地显示了mat select,但当我单击全屏按钮时,mat select中的mat选项不会显示。我一走出全屏模式,就会看到选项面板 这是一个错误还是我遗漏了什么。如果使用本机选择而不是mat选择,则会显示下拉选项 正常模式 全屏模式 在谷歌地图的全屏模式下,mat select不显示面板,但当我检查它时,它就在那里Angular material 角度材质选择(mat Select)在全屏模式下进行角度谷歌贴图时不显示,angular-material,angular-google-maps,Angular Material,Angular Google Maps,我使用的是角度材质和角度谷歌地图。我在时髦的信息窗口中有一个有角度的材质窗体,它在正常模式下工作良好。它很好地显示了mat select,但当我单击全屏按钮时,mat select中的mat选项不会显示。我一走出全屏模式,就会看到选项面板 这是一个错误还是我遗漏了什么。如果使用本机选择而不是mat选择,则会显示下拉选项 正常模式 全屏模式 在谷歌地图的全屏模式下,mat select不显示面板,但当我检查它时,它就在那里 此问题由设计重叠引起,请尝试此操作 最重要的是别忘了把它放在styl
此问题由设计重叠引起,请尝试此操作 最重要的是别忘了把它放在styles.scss(根文件夹) 或 或
Angular material团队有一个支持全屏模式的覆盖容器 在根模块的@NgModule定义中,可能在app.module.ts文件中,执行以下操作:
import {FullscreenOverlayContainer, OverlayContainer} from '@angular/cdk/overlay';
@NgModule({
...
providers: [
{provide: OverlayContainer, useClass: FullscreenOverlayContainer}
],
...
})
现在,所有使用覆盖容器的材料组件都将在全屏模式下工作。发布示例代码!我在文件开头将其添加到style.scss中,但运气不佳。一旦地图进入全屏模式,下拉菜单就会消失。我的问题解决了。谢谢
.cdk-overlay-container {
z-index: 99999 !important;
}
.cdk-global-overlay-wrapper, .cdk-overlay-container {
z-index: 99999 !important;
}
import {FullscreenOverlayContainer, OverlayContainer} from '@angular/cdk/overlay';
@NgModule({
...
providers: [
{provide: OverlayContainer, useClass: FullscreenOverlayContainer}
],
...
})