Display different contents in the menu according to the role of the user


#1

Hello,

I have a menu or sections only to be visible to some users. I have the role user, role admin1, and role admin2 in my database.

For example, how can I make Category 2 visible to the user and admin2 only?

        {
		  "name": "Jack",
		  "fname": "Daniel",
		  "roles": [
		    "ROLE_USER",
		  ]
		}

		{
		  "name": "Rico",
		  "fname": "Phil",
		  "roles": [
		    "ROLE_ADMIN1",
		  ]
		}

		{
		  "name": "Admini",
		  "fname": "Strator",
		  "roles": [
		    "ROLE_USER",
		    "ROLE_ADMIN2"
		  ]
		}

My code :

<ion-item class="item-stable animsvdj" ng-click="toggleGroup(group)" ng-class="{active: isGroupShown(group)}">
      <i class="icon" ng-class="isGroupShown(group) ? 'ion-android-contacts' : 'ion-android-contacts'"></i>
      &nbsp; Category
    </ion-item>
    <ion-item class="item-accordion menu-border" ng-show="isGroupShown(group)" ui-sref="menu.disponibilites" menu-close=""><i class="ion-ios-calendar-outline menu-icon"></i>   Category 1</ion-item>

    <!-- Part that should be visible only by admin -->
    <ion-item class="item-accordion menu-border" ng-show="isGroupShown(group)" ui-sref="menu.organiseVisite" menu-close=""><i class="ion-ios-time-outline menu-icon"></i>   Category 2</ion-item>
    <!-- Part that should be visible only by admin -->
    
    <ion-item class="item-accordion menu-border" ng-show="isGroupShown(group)" ui-sref="menu.trouverUnJeune" menu-close=""><i class="ion-ios-eye-outline menu-icon"></i>   Category 3</ion-item>

thank you :slight_smile:


#2

you can add ng-if or ng-show in ion-item

ex:

ng-if="item.roles= ‘ROLE_ADMIN1’ "


#3

How do you do if you have multiple roles?
For example if a user with 3 roles?


#4

You can add more condition inside ng-if. You should probably search for ng-if directives…

ex:

ng-if="item.roles= ‘ROLE_ADMIN1’ || item.roles= ‘ROLE_USER’ "