Set currently active menu item in sidebar

I am using ionic beta-8 and ion-side-menu to create a side menu that is partially open as per

I have a static list of menu items that is created with the following;

			<ion-item nav-clear class="item-icon-left overview" menu-close href="#/app/overview">
				<i class="icon ion-home"></i>
			<ion-item nav-clear class="item-icon-left" menu-close href="#/app/upload">
				<i class="icon ion-upload"></i>

I would like to have class in the side menu that indicates which is the currently active state.

I read in another forum post that we should use “ui-sref-active” however my attempts to do so were not successful.

How would I add active side menu item to the codepen above ?


Works well for me.


your Ionic list :
<ion-item ui-sref="app.item1" ui-sref-active="active">Item 1/ion-item> <ion-item ui-sref="app.item2" ui-sref-active="active">Item 2</ion-item>

In your css or scss:
ion-list a { background: #ddd !important; }