首页 文章

mat-select在mat-expansion-panel中不起作用

提问于
浏览
1

我们必须在mat-expansion-panel内显示一个表单 . 表单中有多个字段,其中很少有我使用mat-select而另外几个我使用mat-input .

在扩展面板中,matInput正常工作,但mat-select未显示选择可能值的选项 .

虽然mat-select在正常显示时工作正常 .

<mat-expansion-panel>
        <mat-expansion-panel-header>
            Heading 1
        </mat-expansion-panel-header>
        <mat-form-field>
            <mat-select placeholder="Select">
                <mat-option value="1">option 1</mat-option>
                <mat-option value="2">option 2</mat-option>
                <mat-option value="3">option 3</mat-option>
                <mat-option value="4">option 4</mat-option>
            </mat-select>
        </mat-form-field>
    </mat-expansion-panel>

任何帮助表示赞赏 .

1 回答

  • 0

    我通过添加以下样式解决了它

    body div.cdk-overlay-container {
      z-index: 1000000;
    }
    

    通过调试,我知道另一个具有更高z-index的面板覆盖了mat-select选项 . 我提供了增加z-index值到cdk-overlay-container并且它工作 .

    感谢您的支持 .

相关问题