Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

fix(menu-item): properly compile when used with ng-repeat #8852

Closed
wants to merge 1 commit into from

Conversation

crisbeto
Copy link
Member

@crisbeto crisbeto commented Jun 25, 2016

  • Fixes the menuItem directive not compiling properly when used together with ngRepeat. This is due to the fact that ngRepeat passes around a documentFragment, instead of a DOM node, which means that it doesn't have a parent and doesn't allow us to properly determine whether the menuItem is inside of a menuBar. This change switches the behavior by making the menuBar directive mark it's children instead.
  • Minor cleanup in the menuItem directive.
  • Avoided some repetition in the menuBar unit tests.
  • Switches to using the prefixer in the menuItem directive.

Referencing #8117.

Fixes #8697.

@crisbeto crisbeto added the needs: review This PR is waiting on review from the team label Jun 25, 2016
@crisbeto crisbeto changed the title fix(menu-item): properly compile in when used with ng-repeat fix(menu-item): properly compile when used with ng-repeat Jun 25, 2016
setDefault('role', (templateAttrs.type == 'checkbox') ? 'menuitemcheckbox' : 'menuitemradio', buttonEl);
angular.forEach(['ng-disabled'], moveAttrToButton);
setDefault('role', type == 'checkbox' ? 'menuitemcheckbox' : 'menuitemradio', buttonEl);
moveAttrToButton('ng-disabled');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function should be updated to use the prefixer.

To check if the attribute (with all prefixes) is present on the element.

$mdUtil.prefixer().hasAttribute(element, 'ng-disabled');

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry I was not clear.

I mean, that we should also move prefixed attributes.

function moveAttrToButton(attribute) {
  var attributes = $mdUtil.prefixer(attribute);

  attributes.forEach(function(attr) {
    if (templateEl.hasAttribute(attr) {
      button[0].setAttribute(attr, val);
      templateEl[0].removeAttribute(attr);
    }
  }

@@ -20,10 +23,11 @@ function MenuItemDirective($mdUtil) {
templateEl.html('');
templateEl.append(angular.element('<md-icon md-svg-icon="check"></md-icon>'));
templateEl.append(buttonEl);
templateEl[0].classList.add('md-indent');
templateEl.addClass('md-indent');
templateAttrs.$set('mdInMenuBar', null);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you forgot to change that - it should remove the class.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ops, thanks. Good catch.

@crisbeto crisbeto force-pushed the 8697/menu-repeat branch 2 times, most recently from 8ec3fd5 to 1e15366 Compare June 25, 2016 15:03
* Fixes the menuItem directive not compiling properly when used together with ngRepeat. This is due to the fact that ngRepeat passes around a documentFragment, instead of a DOM node, which means that it doesn't have a parent and doesn't allow us to properly determine whether the menuItem is inside of a menuBar. This change switches the behavior by making the menuBar directive mark it's children instead.
* Minor cleanup in the menuItem directive.
* Avoided some repetition in the menuBar unit tests.
* Switches to using the prefixer in the menuItem directive.

Referencing angular#8117.

Fixes angular#8697.
@devversion
Copy link
Member

@ThomasBurleson Looks good to me ;)

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
needs: review This PR is waiting on review from the team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

md-menu: ng-repeat with md-menu-item
3 participants