How to remove the default right icon in ion-item list

Ionic Framework ionic-v3
1

Hi,
Someone please let me know how to remove the default right icon displayed in ion-item list. I want to display my icon (that too when required) in the list.

2

Which element are you using < ion-item > or <a ion-item> ?

3

try this:

<ion-list>
      <ion-item *ngFor="#item of items" (click)="itemSelected(item)">
        {{item.title}}
         <!-- replace this with your icon -->
         <ion-icon *ngIf="item.showIcon" name="rose" item-right></ion-icon>
      </ion-item>
    </ion-list>
1 Like
4

Hi, Thanks for your reply.
I used the similar code excluding the ngIf statement in your code. I got both the icons in my ionic serve view. On including the ngIf statement, i am getting only the default icon displayed and my icon is not displayed. I facing the issue in ionic serve ios view. In Android it works fine without ngIf.

5

Which icon? Are you talking about the right arrow that appears on iOS? You can remove this by using detail-none on the item. Not sure if this is what you’re looking for.

Docs on item: http://ionicframework.com/docs/v2/api/components/item/Item/

It’s hard to tell without seeing your markup/images of what is happening but you may be running into this: https://github.com/driftyco/ionic/issues/5060

11 Likes
6

Thats exactly what i was looking for. Thanks a lot @brandyshea. :slightly_smiling:

1 Like
7

Thanks for your answer, Saved my life. :slight_smile: