卡片标题图标位于右侧

Question

我正在尝试将图标重新定位在右侧的离子卡标题中.检查下面的代码示例和图片.

这是我的代码

...
<ion-card *ngFor="let account of Accounts">
<ion-card-header>      
<span item-left>{{account.title}}</span>
<span item-right><ion-icon (click)="takeAction(account.$key)" name="more"></ion-icon></span>
</ion-card-header>
<ion-card-content>
  <h5>Bank: <b>{{account.bank}}</b></h5>
  <h5>Ac name: <b>{{account.acname}}</b></h5>
  <h5>Ac name: <b>{{account.acno}}</b></h5>
</ion-card-content>

但下图显示了我想要实现的目标

Answer 1

我终于找到了最终的解决方案.它只是添加style="float:right;"

...
<ion-card *ngFor="let account of Accounts">
<ion-card-header>
    <span style="color:blue">{{account.title}}</span>
    <ion-icon style="float: right;" (click)="takeAction(account.$key)" name="more">
  </ion-icon>
</ion-card-header>
<ion-card-content>
  <h5>Bank: <b>{{account.bank}}</b></h5>
  <h5>Ac name: <b>{{account.acname}}</b></h5>
  <h5>Ac name: <b>{{account.acno}}</b></h5>
</ion-card-content>

注意我是如何将ion-header内容放入ion-item元素中的