Ng-show and ng-if is not working on ionic ion-item


#1

What I am trying to do is, when the user successfully logged in, the app will display different menu based on role of user.

Login Controller

//some relevant codes
user = res.data;         
localStorage.setItem("user", JSON.stringify(user));
console.log(user[0].role)

if(user[0].role == 1 ){
    $scope.isAdmin = true;
    $scope.isEmployee = false;
    $state.go("app.home");    
}else if (user[0].role == 2){
    $scope.isEmployee = true;
    $scope.isAdmin = false;
    $state.go("app.home");
}

In these controller, I am trying to set the response data to a user using localStorage to use it for later purposes. If the user entered valid login credentials, app will determine its specific role and redirect to home.

Home Controller

function authenticate() {
var user =localStorage.getItem("user");
user = JSON.parse(user);
      if(user == null){
        console.log('walang user');
      } else if(user[0].role == 1){
        console.log('admin');
        $scope.isAdmin = true;
        $scope.isEmployee = false;
      }else if (user[0].role == 2){
        console.log('employee');
          $scope.isEmployee = true;
          $scope.isAdmin = false;
          console.log($scope.isAdmin);
      }
}

authenticate();

HTML View

<ion-side-menu side="left">
<ion-header-bar class="bar-stable">
  <h1 class="title">RMS</h1>
</ion-header-bar>
<ion-content>
  <ion-list>
    <ion-item ng-show="isAdmin" class="item item-icon-left" menu-close href="#/app/home">
        <i class="icon ion-home"></i>
      Admin Home
    </ion-item>
    <ion-item ng-if="isEmployee" class="item item-icon-left" menu-close href="#/app/home">
      <i class="icon ion-home"></i>
      Employee Home
  </ion-item>

In this view, ng-show and ng-if is not working as I expected. Im having a tough time in this simple showing of certain ion-item depends on the logged-in user.