Want to show and hide sub (side)menu items

ionic-v1
1

I’m trying to use ng-show on an ion-item in the side menu. Basically I’d like to click on a visible ion-item in the side menu and then have an item appear underneath it which has an ng-show attribute on it waiting for the click on the item above. I’ve got the ng-show and and ng-click directives set up correctly, but nothing happens when I click. Is there something in the side menu js/css that is preventing this?

Here is a code snippet:

> <ion-item nav-clear class="item-icon-left" ng-click="showsubs=true">
>             <i class="icon ion-android-book"></i>
>             Read
>         </ion-item>
>         <ion-item ng-show="showsubs">Test</ion-item>

More Info:
What I’ve found is that putting an ng-click on an ion-item doesn’t seem to work in a side menu. I can put a div below it and have another ion-item show/hide, so I know the controller and directives are working.

2

In your controller you should set $scope.showsubs to an initial value of false, then in your ng-click you should say showsubs = !showshubs (so it toggles, you can hide it again this way)

3

@martin_spriggs
you can use toggleGroup.
Take a look…

4

Here is a codepen of what I’m trying to do:

http://codepen.io/mspriggs/pen/fedob