选择选项显示在对话框 ngDialog 后面答案

【问题标题】：select options are showing behind the dialog box ngDialog选择选项显示在对话框 ngDialog 后面
【发布时间】：2016-09-15 17:29:51
【问题描述】：

我正在尝试在我的应用程序中使用 ngDialog** 插件，不幸的是 md-options 显示在对话框后面。

这里是 HTML 代码：

<md-card>
<md-card-content>
                    <div layout="row">
                        <md-input-container>
                          <label>State</label>
                          <md-select ng-model="ctrl.userState">
                            <md-option><em>None</em></md-option>
                             <md-option ng-repeat="user in rao">{{user.name}}</md-option>
                          </md-select>
                        </md-input-container>
                    </div>
                </md-card-content>
            </md-card>

输出是： enter image description here

【问题讨论】：

标签： angularjs ng-dialog

【解决方案1】：

最后我通过设置 z-index 值找到了解决这个问题的方法。实际上我正在使用 ngDiloag 和角材料。所以，这里的 md-select 是 ngDialog 后面的渲染选项。所以我设置了z-index

.ngdialog.ngdialog-theme-default {
  z-index: 80;
}

【讨论】：

【解决方案2】：

试试这个，

    <md-dialog aria-label="options dialog">
            <md-dialog-content layout-padding>
              <h2 class="md-title">Choose an option</h2>
              <md-select ng-model="myModel" placeholder="Pick">
                <md-option>1</md-option>
                <md-option>2</md-option>
                <md-option>3</md-option>
              </md-select>
             </md-dialog-content>
             <md-dialog-actions>
             <span flex></span>
             <md-button ng-click="close()">Okay!</md-button>
            </md-dialog-actions>
    </md-dialog>

WORKING DEMO

【讨论】：

感谢您的回复，但问题仍然存在，现在我看到一个空的模态对话框，但如果我点击表面 drop 将在模态对话框后面打开
@kkgowtamasa 我没有遇到问题，您使用的是哪个浏览器以及版本？
我同时使用角材料和引导程序会导致任何问题
@kkgowtamasa 是的，这可能是个问题！如果有帮助，请标记为答案

【解决方案3】：

只需更新“angular-material.min.css”文件中的类。

.md-select-menu-container, 
.md-open-menu-container {
    z-index:999999important;
}

【讨论】：