title: Error Invalid HTML for md-menu: Expected two children elements
body: <p>The expected behaviour of md-menu is that we do the following:</p>
  
  <pre><code>&lt;md-menu&gt;
      &lt;button ng-click="$mdOpenMenu()"&gt;Filters&lt;/button&gt;
      &lt;md-menu-content&gt;
          &lt;md-menu-item ng-repeat="field in devices.fieldList"&gt;&lt;md-button ng-click="devices.setFilter(field)" ng-bind="field.name"&gt;&lt;/md-button&gt;&lt;/md-menu-item&gt;
      &lt;/md-menu-content&gt;
  &lt;/md-menu&gt;
  </code></pre>
  
  <p>However I have a situation when using md-menu-bar that I want a quick access button to refresh some data, this causes an error Invalid HTML for md-menu: Expected two children elements. Although I could perhaps look at a different UI it feels like you should be able to have the following functionality wise it works great:</p>
  
  <p>Snippet</p>
  
  <pre><code>&lt;md-menu-bar&gt;
      &lt;md-menu&gt;
          &lt;button ng-click="$mdOpenMenu()"&gt;Filters&lt;/button&gt;
          &lt;md-menu-content&gt;
              &lt;md-menu-item ng-repeat="field in devices.fieldList"&gt;&lt;md-button ng-click="devices.setFilter(field)" ng-bind="field.name"&gt;&lt;/md-button&gt;&lt;/md-menu-item&gt;
          &lt;/md-menu-content&gt;
      &lt;/md-menu&gt;
      &lt;md-menu&gt;
          &lt;button ng-click="data.refresh()"&gt;&lt;md-icon class="material-icons"&gt;refresh&lt;/md-icon&gt;&lt;/button&gt;
      &lt;/md-menu&gt;
  &lt;/md-menu-bar&gt;
  </code></pre>
  
  <p>Is there any reason this should not be done?</p>