jatinder bhola
jatinder bhola

Reputation: 385

mdMenu: Cannot read property 'open' of null

Working with angular-material design, found a bug... On md-menu, if you have a sub menu item (as you can see in the image)and you open the subMenu and then hover over the non-subMenu item (menu item) it throws the error "Cannot read property 'open' of null" and remains highlighted even after hovering over a different menu items and need a click to open sub-menu-item.

code:

<md-menu>
        <button ng-click="$mdOpenMenu()">menu</button>
        <md-menu-content>
          <md-menu-item>
            <md-button ng-click="---">menu item</md-button>
          </md-menu-item>
          <md-menu-divider></md-menu-divider>
          <md-menu-item>
            <md-menu>
              <md-button ng-click="$mdOpenMenu()">sub menu</md-button>
              <md-menu-content>
                <md-menu-item><md-button ng-click="---">sub menu item</md-button></md-menu-item>
              </md-menu-content>
            </md-menu>
          </md-menu-item>
        </md-menu-content>
      </md-menu>   

Error get when i hover on menu item from sub menu item..[![][1]]2

Upvotes: 1

Views: 2481

Answers (1)

harmoniemand
harmoniemand

Reputation: 259

You copied the sample from the docs. These samples does not work.

 <md-menu>
   <md-button ng-click="openMenu($mdOpenMenu, $event)">MENU</md-button>
   <md-menu-content width="4">
     <md-menu-item>
       <md-button ng-click="---">sub menu item</md-button>
     </md-menu-item>
   </md-menu-content>
 </md-menu>

And in your controller:

 var originatorEv;
 scope.openMenu = function ($mdOpenMenu, ev) {
        originatorEv = ev;
        $mdOpenMenu(ev);
    };

Upvotes: 1

Related Questions