Question

在这里演示：http://codepen.io/audiodude/pen/vLyNvw

顶部和底部之间的唯一区别是顶部使用带有md-button属性的ng-href，其由Angular Material编译为a标记，而底部使用简单md-button，将其编译为button标记。但是，.md-button类似乎确实为按钮的锚版本添加了所有相同的样式。

那么为什么顶部示例中的菜单似乎被推到了新的一行？

Answer 1

<div ng-controller="AppCtrl" ng-cloak="" class="buttondemoBasicUsage" ng-app="MyApp">
  <md-content layout="column" layout-align="start center">
    <div layout="row" layout-align="center" layout-fill>
      <md-card flex-sm="95" flex-gt-md="70" layout="column">
        <div layout-sm="column" layout-gt-sm="row" flex>
          <div flex layout>
            <md-button ng-href="https://www.google.com" class="md-primary">
              <md-icon aria-label="launch">launch</md-icon> Link
            </md-button>
            <md-menu>
              <md-button aria-label="Open edit menu" class="md-icon-button" ng-click="$mdOpenMenu($event)">
                <md-icon md-menu-origin>arrow_drop_down</md-icon>
              </md-button>
              <md-menu-content width="5">
                <md-button>Menu Choice</md-button>
              </md-menu-content>
            </md-menu>
          </div>
          <span flex></span>
        </div>
      </md-card>
    </div>
  </md-content>

  <md-content layout="column" layout-align="start center">
    <div layout="row" layout-align="center" layout-fill>
      <md-card flex-sm="95" flex-gt-md="70" layout="column">
        <div layout-sm="column" layout-gt-sm="row" flex>
          <div flex>
            <md-button class="md-primary">
              <md-icon aria-label="launch">launch</md-icon> Link
            </md-button>
            <md-menu>
              <md-button aria-label="Open edit menu" class="md-icon-button" ng-click="$mdOpenMenu($event)">
                <md-icon md-menu-origin>arrow_drop_down</md-icon>
              </md-button>
              <md-menu-content width="5">
                <md-button>Menu Choice</md-button>
              </md-menu-content>
            </md-menu>
          </div>
          <span flex></span>
        </div>
      </md-card>
    </div>
  </md-content>
</div>

您只是忘了在第6行添加“layout”属性（默认情况下是行）。

当ng-href添加到按钮时，为什么md-menu不与md-button对齐？

1 个答案: