2

ドキュメント内に基本的な<md-menu>要素があります。デフォルトでは、ドキュメント内のどこかをクリックすると自動的に閉じます。fixedただし、要素内をクリックすると、要素z-indexは閉じません。

<div class="menu-demo-container" layout-align="center center" layout="column">
  <md-menu>
    <md-button class="md-primary md-raised" ng-click="ctrl.openMenu($mdOpenMenu, $event)">
      Test
    </md-button>
    <md-menu-content width="4">
      <md-menu-item>
        <md-button>
          Menu Item
        </md-button>
      </md-menu-item>
    </md-menu-content>
  </md-menu>
</div>

<div style="position:fixed; z-index: 100; backgorund-color:red;left:0;top:0;bottom:0">
  Try clicking here while the the md-menu is open
</div>

固定要素を含め、要素以外の場所をクリックすると、すべての<md-menu>要素を閉じるにはどうすればよいですか?

ワーキングデモ

4

1 に答える 1

5

z-index背景の より大きい 要素の問題z-index。md-backdrop要素をクリックしてメニューを閉じることができます。md-backdrop.md-menu-backdropはz-index99 です。

スタック順序が大きい要素は、常にスタック順序が小さい要素の前にあります。

問題を解決するには、要素の z-index を減らします。あなたの場合、それはより少ないはずです99

于 2016-01-20T14:33:58.493 に答える