Angular UIドロップダウンの問題

Question

firefoxでは、UI Bootstrapのドロップダウンで子要素をクリックすることはできません。つまり、ドロップダウンメニューが表示されますが、レイヤーの最後のバックグラウンドにあると思われます。その層に着くと、私はul、liなどでz-indexを試しましたが、これはうまくいきません。

また、Chromeでこの問題は発生しません。コードは期待通りに機能します。

     <div id="myDropdownMenu" > 
          <button uib-dropdown uib-dropdown-toggle class="btn btn-default menu-btn" title="Menu"> 
           <ul uib-dropdown-menu> 
            <li role="menuitem" ng-repeat="menuitem in vm.dropdownmenu" ng-click="vm.onDropdownMenuClick(menuitem.value)"> 
             <span class="dropdown-item">{{menuitem.label}}</span> 
            </li> 
           </ul> 
           <span class="glyphicon glyphicon-menu-hamburger" style="font-size: 32px;"></span> 
          </button> 
         </div> 

Answer 1

私はUIB-ドロップダウンのドロップダウン・アペンド - ボディ

ドロップダウン・アペンドツー体B（デフォルト：false）を使用していることを修正しました - 内部dropdown-を追加メニューをbody要素に追加します。

今、正しいコードは次のようになります。私はdocumentationに読んで、私はそれを見るように

<div id="myDropdownMenu" uib-dropdown dropdown-append-to-body> 
          <button class="btn btn-default menu-btn" uib-dropdown-toggle title="Меню"> 

           <ul uib-dropdown-menu> 
            <li role="menuitem" ng-repeat="menuitem in vm.dropdownmenu" ng-click="vm.onDropdownMenuClick(menuitem.value)"> 
             <span class="dropdown-item">{{menuitem.label}}</span> 
            </li> 
           </ul> 
           <span class="glyphicon glyphicon-menu-hamburger" style="font-size: 32px;"></span> 

          </button> 
         </div> 

、このオプションは、このパラメータを使用せずに、身体にドロップダウンを内側のドロップダウン・メニューを追加しますメニューは、作成されたレイヤーとは関係なくどこかに浮かんでいます。

この設定が具体的な理由と使用しないと便利だと誰もが言うことができる場合は有益でしょう。