Ionic framework 将图标放置在输入字段中或旁边

我有一个我正在更新的ionic 1应用程序

新要求之一是在输入字段的右侧添加一个“x”

我已经尝试了很多方法，这是我认为最接近正确实现的方法，但仍然不起作用

有什么想法吗

<form action="">
  <input type="text" onfocus="this.placeholder = ''" style="border-top:none; border-left:none; border-right:none; border-bottom:solid gray 3px; background:transparent; margin-left:auto; margin-right:auto; text-align:center; font-size:1.2em; margin-bottom:20px; color:#acb2b4;" placeholder="{{profileEdit.userName}}" ng-model="profileEdit.theUserName">
  <i class="icon ion-close" style="font-size:14px;" item-right></i>
</form>

---

您可以使用

列表

和

项目

类，以及右侧的

项目图标

类来实现所需功能。以下是一个工作示例：

angular.module（'ionicApp'，['ionic']））
.controller（'MainCtrl'，函数（$scope）{
});

输入X图标
在右边输入X图标