選擇選項顯示在對話框後面ngDialog

我試圖在我的應用程序中使用ngDialog **插件，不幸的是，md-options顯示在對話框後面。選擇選項顯示在對話框後面ngDialog

這裏是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

來源

2016-09-15 kk gowtamasa

試試這個，

<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

來源

2016-09-15 17:34:19 Sajeetharan

感謝您的答覆，但問題仍然存在，現在我看到一個空模態對話框，但如果我在表面上降點擊可以取出模態對話框 –

@kkgowtamasa後面我沒有得到打開相同問題，您正在使用哪個瀏覽器和版本？ – Sajeetharan

我使用鉻。 –

終於讓我找到了解決方案，這問題通過設置z-index v ALUE。其實我使用ngDiloag和角材料。所以，這裏md-select是ngDialog後面的渲染選項。所以我設置Z指數

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

來源

2016-09-17 07:10:48

只需更新「angular-material.min.css」文件中的類。

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

來源

2017-06-30 08:57:20

選擇選項顯示在對話框後面ngDialog

回答

相關問題