Sidemenu items arrow missing

ionic-v1
1

I’m developping an app with a side menu. In the official documentation all menu items have a grey arrow on their right side:docu

How can I achieve this? Here is my code:

  <ion-side-menu side="left">
        <ion-header-bar class="bar-dark"><!-- bar-stable -->
            <h1 class="title">Menu</h1>
        </ion-header-bar>
        <ion-content>
            <ion-list>
                <ion-item nav-clear menu-close href="#/app/complexOverview">
                    Complexen
                </ion-item>
                <ion-item nav-clear menu-close ng-click="login()">
                    Login
                </ion-item>
            </ion-list>
        </ion-content>
    </ion-side-menu>

Thank you in advance!

2

Add “item-icon-right” css class to the item and then add the icon

   <ion-side-menu side="left">
        <ion-header-bar class="bar-dark"><!-- bar-stable -->
            <h1 class="title">Menu</h1>
        </ion-header-bar>
        <ion-content>
            <ion-list>
                <ion-item nav-clear menu-close href="#/app/complexOverview" class="item-icon-right">
                    Complexen
                    <i class="icon ion-ios-arrow-right"></i>
                </ion-item>
                <ion-item nav-clear menu-close ng-click="login()">
                    Login
                </ion-item>
            </ion-list>
        </ion-content>
    </ion-side-menu>
3

Thank you for your answer! I still think its strange that in every example I see it shows up automatic. So it feels a bit like a dirty fix doing it like that. Or am I wrong?

4

No, not a hack. iOS and Android have different guidelines so I understand why it doesn’t just “show up”. Besides this way gives you the flexibility to swap out the chevron with any ionicon

1 Like
5

Long ago (way back in alpha) we disabled the auto-adding of the arrows.
Like @aoathout said, it allows for more flexibility

1 Like