Javascript 角垫选择don';t在移动或低宽度设备上正确显示选项

Javascript 角垫选择don';t在移动或低宽度设备上正确显示选项,javascript,angular,typescript,angular-material,angular6,Javascript,Angular,Typescript,Angular Material,Angular6,我在一个角度项目中使用mat select。对于大屏幕,选项会正确显示,但在移动或低分辨率屏幕上则相反。 实际上,显示了选项,但缺少文本。 我尝试设置垫子选项的最大宽度,但没有成功。 当我选择一个选项时,它会被正确地选择和显示,但无法知道选择了哪个选项。 用图像,, 预期行为: 当前行为: 目前,带有答案的文本在屏幕左侧。如果将下拉列表中的字符串设置得很长,您将开始看到它们 您需要更改以下css属性: .cdk-overlay-pane { min-width: 200px !impo

我在一个角度项目中使用mat select。对于大屏幕,选项会正确显示,但在移动或低分辨率屏幕上则相反。 实际上,显示了选项,但缺少文本。 我尝试设置垫子选项的最大宽度,但没有成功。 当我选择一个选项时,它会被正确地选择和显示,但无法知道选择了哪个选项。 用图像,, 预期行为:

当前行为:


目前,带有答案的文本在屏幕左侧。如果将下拉列表中的字符串设置得很长,您将开始看到它们

您需要更改以下css属性:

.cdk-overlay-pane {
    min-width: 200px !important; //or whatever width you want goes here
    .mat-select-panel {
        min-width: auto !important;
    }
}

!重要信息
标记用于覆盖原生材质样式。

哦,我在组件typescript文件中设置了封装:无,现在可以使用了。