在ion-col中按钮的右对齐

Ham*_*med 17 ionic-framework ionic2 ionic3

我的Ionic 2应用程序中有这个网格.是否有任何特定于离子的属性使按钮显示在列(行)的右侧?

<ion-grid>
  <ion-row>
    <ion-col>col 1</ion-col>
    <ion-col>col 2</ion-col>
  </ion-row>
  <ion-row>
    <ion-col>
      <button ion-button>My button</button>
    </ion-col>
  </ion-row>
</ion-grid>
Run Code Online (Sandbox Code Playgroud)

rob*_*nnn 26

在您的情况下,您可以float-right像这样添加属性:

<button ion-button float-right>My button</button>
Run Code Online (Sandbox Code Playgroud)

浮子{}修改
文件说,你可以添加属性float-{modifier}来定位它的容器内的元素.

{modifier}可以是以下任何一种
right::元素将浮动在其容器的右侧.
left:元素将浮动在其容器的左侧.
start:float-left如果方向是从右到左,则方向是从左到右,向右浮动.
end:如果方向是从左到右,则与float-right相同;如果方向是从右到左,则为float-left.

例:

<div>
    <button ion-button float-right>My button</button>
</div>
Run Code Online (Sandbox Code Playgroud)

本期特价货品{}修改
要定位内的一个元素ion-item文件说,你可以使用item-{modifier}.

哪里{modifier}可以是以下任何一种
start::放置在内部项目之外的所有其他元素的左侧.
end:放置在输入包装器外部的内部项目内部的所有其他元素的右侧.
content:放置在输入包装内部的任何离子标签的右侧.

例:

<ion-item>
    <button ion-button item-end>My button</button>
</ion-item>
Run Code Online (Sandbox Code Playgroud)

弃用
根据文档,这些名称已被弃用:

item-right & item-left