Ng-show not working in ion-side-menu item icon

ionic-v1
1

Any ideas folks? I’m using something simple like:

<ion-side-menus>
    <ion-side-menu side="left">
            <ion-content>
                <a class="item-icon-right" menu-toggle="left" ng-click="toggleOn()" href="#">
                    Is On:  {{menuData.iconOn}}
                    <i ng-show="{{menuData.iconOn}}" class="icon ion-checkmark-round"></i>
                </a>
        </ion-content>
    </ion-side-menu>

    <ion-side-menu-content>        
        <ion-nav-view name="menuContent"></ion-nav-view>
    </ion-side-menu-content>
</ion-side-menus>

And my controller:

.controller('MenuCtrl', function($scope, $ionicSideMenuDelegate, ContextFactory) {
    $scope.menuData = {
        iconOn: false
    };

    $scope.toggleLeft = function() {
        $ionicSideMenuDelegate.toggleLeft();
    };


    $scope.toggleOn = function() {
        $scope.menuData.iconOn= !$scope.menuData.iconOn;
    };
})

When I click the side menu item the “Is On:” field gets updated with true or false but the ng-show does not kick in to show or hide the icon. Anyone got any quick ideas? This is driving me mad!

2

ng-show does not need you to wrap your expression in brackets.

Do this :

ng-show="menuData.iconOn"

Instead of this :

ng-show="{{menuData.iconOn}}"
3

You are a lifesaver! :smile:

Works a treat now! Thanks so much