Ionic side menu - displaying links based on if user is authenticated or not

Question

I have an ionic app, where I have one side menu for multiple pages. I would like to change the links in the side menu based on whether the user is authenticated or not. So, in the routes I have set up the templates and pages like this:

module.export = angular.module('coop').config(function($stateProvider, $urlRouterProvider) {
  $stateProvider

  //side menu
  .state('main', {
    url: '/main',
    abstract: true,
    templateUrl: 'templates/main.html',
  })

 .state('main.public', {
    url: '/public',
    views: {
      'content': {
        templateUrl: 'templates/public.html',
        controller: 'PublicController'
      }
    },
    authenticate: false
  })

  .state('main.articles', {
    url: '/articles',
    views: {
      'content': {
        templateUrl: 'templates/articles.html',
        controller: 'ArticlesController'
      }
    },
    authenticate: true
  }) 

So, the links should be different for the states main.public and main.articles and all the other states based on whether the state has authenticate: true or false. How can I check that in the side menu?

<ion-side-menus>
  <ion-side-menu side="left" class="side-menu" scroll="false">
    <ul class="menu">
      <div class="side-menu-header">
      </div>
      <div class="menu-main">
        <li>
          <a ng-if="authenticated" menu-close ui-sref="main.profile">Min profil</a>
          <a ng-if="!authenticated" menu-close ui-sref="main.login">Logg in</a>
        </li>
      </div>
      <div class="menu-last">
        <li>
          <a ng-if="authenticated" menu-close ui-sref="main.logout">Logg out</a>
        </li>
      </div>
    </ul>
  </ion-side-menu>
  <ion-side-menu-content>
    <ion-nav-view name="content"></ion-nav-view>
  </ion-side-menu-content>
</ion-side-menus>

Update

For anyone how might need this, I solved it by setting the rootscope variable on stateChangeStart of the app.js:

// Check for login status when changing page URL
  $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {
    var currentRoute = toState.name;
    $rootScope.authenticated = false;

    if ($auth.isAuthenticated()) {
      $rootScope.authenticated = true;
    }

Answer 1

You did it actually. In the controller add $scope.authenticated = $state.authenticate

Or set a global value globals.authenticated in a service called globals on login/logout. Then use it in the side menu. ng-if="globals.authenticated"

Or you can set it in the loacal storage/ sqlite