Cannot read property 'setAttribute' of null when clicking on 'menu' when using data-ng-click="$mdOpenMenu()"

[DBassel]

TypeError: Cannot read property 'setAttribute' of null, when click event is marked by:
data-ng-click="$mdOpenMenu()"
when is marked:
ng-click="$mdOpenMenu()"
the issue disappears.

Thanks!

[Frank3K]

I don't think this issue is completely fixed, compared to what I expected earlier in #3252.

The file _menu.js contains the following references to ng-click only:

Lines 150-152

    if (!triggerElement.hasAttribute('ng-click')) {
      triggerElement = triggerElement.querySelector('[ng-click]');
    }

Lines 187-190:

  this.init = function(setMenuContainer) {
    menuContainer = setMenuContainer;
    triggerElement = $element[0].querySelector('[ng-click]');
  };

Can someone reopen this issue?

[amobiz]

Cannot read property 'setAttribute' of null

in material/src/components/menu/js/menuController.js

Lines 26-27:

triggerElement = $element[0].querySelector('[ng-click],[ng-mouseenter]');
triggerElement.setAttribute('aria-expanded', 'false');

Where triggerElement is null when there is no element with ng-click or ng-mouseenter attribute inside md-menu.

[cmacdonnacha]

+1

[homerjam]

+1

[kaldebert]

+1

[ghost]

+1

[jacobuk]

+1

[manoharnv]

+1

[Karvel]

+1

[CanMehmetK]

+1

[farantesrodrigues]

ng-dblclick raises this error. ng-click does not.

[ghost]

Can anyone help us , we stuck at below mentioned issue..thank you in advance

TypeError: Cannot read property 'setAttribute' of null at e.init

[devversion]

@Prajwal8 A pull request, which automatically adds the prefix is pending.

[ghost]

TypeError: Cannot read property 'setAttribute' of null at e.init...this issue did not solved yet, this is causing delay in completion of the project...Can anyone help us ??

[devversion]

@Prajwal8 Did you properly create a menu with an element to open the menu (~ trigger element)

Also the new prefixer is available in the new v1.1.0 release.

[ghost]

Ya...but am still facing this issue!

[ghost]

@devversion am posting my code, write now i have hard coded the data...please do replay back

index.html

        <md-menu class="persondropdown">
                  <md-button href="" class="md-icon-button"
                           ng-click="headerObj.openMenu($mdOpenMenu, $event)"
                         aria-label="Personal Profile     Dropdown Menu">
             <span><img class="personimage" src="assets/images/person.png"></span> 
                    <span class="hidden-xs">{{loggedInUser}}</span> 
                    <span>
                  <md-icon md-font-icon="zmdi zmdi-caret-down"></md-icon>
                  <md-tooltip>Personal Profile</md-tooltip>
                  </span> 

        </md-button>
                <md-menu-content class="userflyout" width="4">
                  <md-subheader class="font-medium">Switch to:</md-subheader>
                  <md-menu-item>
                    <md-button ui-sref="home" aria-label="home"> <i class="profile-myprofile-icon"></i> 
                          home </md-button>
                  </md-menu-item>
                  <md-menu-item>
                    <md-button ui-sref="myprofile" aria-label="myprofile"> <i class="myprofile-icon"></i> myprofile </md-button>
                  </md-menu-item>
                  <md-menu-item>
                    <md-button ui-sref="date" aria-label="date"> <i class="profile-date-icon"></i> date </md-button>
                  </md-menu-item>

                  <md-menu-item>
                    <md-button ui-sref="changePassword" aria-label="Change Password"> 
                          Change Password   </md-button>
                  </md-menu-item>

                </md-menu-content>
              </md-menu>


ctrl.js

this.openMenu = function ($mdOpenMenu, ev) {

        $mdOpenMenu(ev);
    };

[ghost]

index.html

     <md-menu class="persondropdown">
            <md-button href="" class="md-icon-button" ng-click="headerObj.openMenu($mdOpenMenu, $event)" aria-label="Personal Profile Dropdown Menu"> <span><img class="personimage" src="assets/images/person.png"></span> 
                <span class="hidden-xs">{{loggedInUser}}</span> 
                <span>
              <md-icon md-font-icon="zmdi zmdi-caret-down"></md-icon>
              <md-tooltip>Personal Profile</md-tooltip>
              </span> 

             </md-button>
            <md-menu-content class="userflyout" width="4">
              <md-subheader class="font-medium">Switch to:</md-subheader>
              <md-menu-item>
                <md-button ui-sref="home" aria-label="home"> <i class="profile-myprofile-icon"></i> home </md-button>
              </md-menu-item>
              <md-menu-item>
                <md-button ui-sref="myprofile" aria-label="myprofile"> <i class="myprofile-icon"></i> myprofile </md-button>
              </md-menu-item>
              <md-menu-item>
                <md-button ui-sref="date" aria-label="date"> <i class="profile-date-icon"></i> date </md-button>
              </md-menu-item>
              <md-divider></md-divider>
              <md-menu-item>
                <md-button ui-sref="account" aria-label="account"> account </md-button>
              </md-menu-item>
              <md-menu-item>
                <md-button ui-sref="changePassword" aria-label="Change Password"> Change Password </md-button>
              </md-menu-item>
              <md-menu-item>
                <md-button ng-click="headerObj.logOut()" aria-label="Sign out"> Sign out </md-button>
              </md-menu-item>
            </md-menu-content>
          </md-menu>

ctrl.js
this.openMenu = function ($mdOpenMenu, ev) {
originatorEv = ev;
$mdOpenMenu(ev);
};

[devversion]

I cannot see any issues with that code. Tested in a codepen, and works like a charm without any errors.

http://codepen.io/DevVersion/pen/pEzxzG?editors=1000

[ghost]

Thanks for the replay...am using the same code ,but some how am getting the error....please do suggest .what might possibly went wrong????

[devversion]

As previous mentioned, I assume you still use an older version than v1.1.0.

Also this is not the right place to discuss those things - Questions like this are normally for the Angular Material Forum

[ghost]

Thank you...

[rlaphoenix]

Just feed it ng-click="null" aswell as your custom way to open the menu (ng-right-click e.t.c). It will not do any errors, and will work. 👍