Question

这是我的代码：

<section layout="row">
    <div layout="row">
      <md-input-container>
        <label translate>enter merchant type</label>
        <input type="text" ng-readonly="true" ng-model="vm.sector.merchantType">
      </md-input-container>
    </div>
    <div layout="row" layout-align="end none">
      <md-button class="md-primary" ng-click="vm.openSectorDetail(vm.sector.id)">
        <label translate>merchant call </label>
        <md-icon>link</md-icon>
      </md-button>
    </div>

  </section>

你也可以从这里看到： http://plnkr.co/edit/xZiHtOgXN871xu3X2inO?p=preview

输入容器和按钮必须在同一行。该部分不是强制性的。

按钮必须在右侧。

我在div中尝试了div但是在部分内部没有工作或div。

Answer 1

只需将您的代码更改为：

<section layout="row" layout-sm="column" layout-align="end center" layout-wrap>
   <span layout="row" layout-align="start center" flex>
   <md-button class="md-primary">Submit</md-button>
   <span flex></span>

  <md-button class="md-warn">Cancel</md-button>
  <md-button class="md-warn">Delete Boundary Partner Type</md-button>
</section>

这将把它全部放在同一条线上。如果这不是您想要的，请告诉我。

Answer 2

您需要做的就是将layout-align从layout-align="end none"更改为layout-align="end end"。

<div flex="100" flex-gt-md="100">
    <div class="padding-0">
        <div layout="row" layout-align="end end">
            <md-button
                  class="md-raised md-primary margin-left-20"
                  ng-click="vm.workspacesClick()"
                  translate="CONTENT_MANAGEMENT.BUTTON_BACK_TO_WORKSPACES"
                  aria-label="{{'CONTENT_MANAGEMENT.BUTTON_BACK_TO_WORKSPACES' | translate}}">
            </md-button>
        </div>
    </div>
</div>

Angular md按钮右对齐

2 个答案: