Material: md-tooltip does not work together with md-menu

Created on 13 Jan 2016  路  10Comments  路  Source: angular/material

I am using a md-menu with a lot of tooltips inside the menu element.
In material version 1.0.0-rc4 it was working fine. Since upgrading to 1.0.1 it is broken.
The tooltips all appear when hovering the button to open the md-menu, but when it is open, no tooltips are shown.
See the demo:
http://one-logic.github.io/md-color-menu/
(after opening the menu every color should have a tooltip)

this is the code:

     <md-menu md-position-mode="target-right target">
        <div ng-click="vm.openMenu($mdOpenMenu, $event)" ng-transclude=""></div>
          <md-menu-content class="md-cm">
            <div></div>
            <div class="md-cm-swatches" layout="row">
              <div ng-repeat="swatch in vm.colors" layout=column>
                <div ng-repeat="color in swatch" class="md-cm-color" ng-style="color.style" ng-click="vm.selectColor(color)" layout="row" layout-align="center center">
                  <span ng-if="color.name == vm.color.name">&#10004;</span>
                  <md-tooltip>{{color.name}}</md-tooltip>
                </div>
              </div>
            </div>
          </md-menu-content>
        </md-menu>
minor integration

Most helpful comment

after looking at the code, I try giving style="pointer-events: auto" to md-tooltip's parent as a workaround. and it works perfectly.

<any style="pointer-events: auto">
  <md-tooltip>foo</md-tooltip>
  ...
</any>

All 10 comments

+1
Same issue here.

+1
Same problem with me, glad I'm not alone

+1

+1

+1, here is the codepen: http://codepen.io/anon/pen/wGveJW
I noticed that the issue happens only if there is an "ng-if" in the mix.

@STOpandthink i have the same unwanted behavior when using ng-show instead of ng-if

after looking at the code, I try giving style="pointer-events: auto" to md-tooltip's parent as a workaround. and it works perfectly.

<any style="pointer-events: auto">
  <md-tooltip>foo</md-tooltip>
  ...
</any>

+1 same problem, but when i put ng-show instead of nf-if the behaviour of tooltip is normal.

Why was it closed? The issue still present in 1.1.0.

We will not fix this for ngM1.x.

Was this page helpful?
0 / 5 - 0 ratings