feat(mdMenu): add md-prevent-menu-close

closes #5457, closes #4334

src/components/menu/js/menuDirective.js

@@ -102,6 +102,23 @@
  * <!-- menu-content -->
  * </md-menu>
  * </hljs>
+
+ * ### Preventing close
+ *
+ * Sometimes you would like to be able to click on a menu item without having the menu
+ * close. To do this, ngMaterial exposes the `md-prevent-menu-close` attribute which
+ * can be added to a button inside a menu to stop the menu from automatically closing.
+ * You can then close the menu programatically by injecting `$mdMenu` and calling 
+ * `$mdMenu.hide()`.
+ *
+ * <hljs lang="html">
+ * <md-menu-item>
+ * <md-button ng-click="doSomething()" aria-label="Do something" md-prevent-menu-close="md-prevent-menu-close">
+ * <md-icon md-menu-align-target md-svg-icon="call:phone"></md-icon>
+ * Do Something
+ * </md-button>
+ * </md-menu-item>
+ * </hljs>
  *
  * @usage
  * <hljs lang="html">

src/components/menu/js/menuServiceProvider.js

@@ -291,8 +291,8 @@ function MenuProvider($$interimElementProvider) {
  // there is an ng-click and that the ng-click is not disabled
  do {
  if (target == opts.menuContentEl[0]) return;
- if (hasAnyAttribute(target, ['ng-click', 'ng-href', 'ui-sref']) ||
- target.nodeName == 'BUTTON' || target.nodeName == 'MD-BUTTON') {
+ if ((hasAnyAttribute(target, ['ng-click', 'ng-href', 'ui-sref']) ||
+ target.nodeName == 'BUTTON' || target.nodeName == 'MD-BUTTON') && !hasAnyAttribute(target, ['md-prevent-menu-close'])) {
  var closestMenu = $mdUtil.getClosest(target, 'MD-MENU');
  if (!target.hasAttribute('disabled') && (!closestMenu || closestMenu == opts.parent[0])) {
  close();