md-menu not click able

[emps]

ng-click on buttons inside md-menu-item not working
( md-menu-item md-button ) im on master

btw demo of (codepen works)

[ttruongatl]

I had the same error.

[jayeshanandani]

+1

[GoulwenBZH]

I had the same problem in rc6 and master.

[WolfSoko]

Did you check if it's a problem with z-index stacking? The pointer-events are catched by the md-backdrop.

For me, the md-backdrop that gets attached to the body, was in front of the opened menu.

The problem is that the md-open-menu-container is in RC6 a child of md-menu. If the md-menu is inside a different z-index stacking branch the backdrop can be above it.

<md-backdrop> --> z-index: 94
<any-element> 
  <another element> --> z-index: < 94
    <md-menu/> --> z-index: 95 but it is always under the backdrop because the z-index: 94 of the parent is handled as independent stacking branch.
  </another element>
</any-element>

I hope this helps a little bit. When you increase the z-index of the another-element you'll loose that click anywhere to close menu behavior (above the area of the another element).

[brianppoole]

I'm noticing the same thing as @SuperheroicCoding . Here's a short demo of some evidence that at least some of this could be z-index related:

Also, I'm noticing the font color changed to white after updating to RC6, but that might be unrelated since I tend to play with the themes a lot.

If I have time soon, I'll create a CodePen isolating the issue.

[WolfSoko]

@brianppoole exactly, thanks for the demo. Yes the font color is maybe from a custom style. Perhaps on md-menu. I had the same issue.

[sathishvj]

@SuperheroicCoding Is there a workaround z-index we can use? Also on which element? I've been trying a bunch of combinations without success.

[WolfSoko]

@sathishvj
I don't see a quick fix for that.

But you can make the menu working again. Try to reduce the md-backdrop z-index until your open menu receives the clicks again. The menu will work, but the closing of the menu when you click outside will not work above the toolbar.