2016-06-17 2 views
0

У меня есть Ионное приложение, у которого есть меню + меню, эта проблема специфична для меню.Показать/скрыть меню в соответствии с пользовательской привилегией

Я определяю свою побочное меню в index.html как этот

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
    <title></title> 

    <script src="lib/ionic/js/ionic.bundle.js"></script> 
    <script src="cordova.js"></script> 
    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 
    <script src="js/app.js"></script> 
    <script src="js/controllers.js"></script> 
    <script src="js/routes.js"></script> 
    <script src="js/services.js"></script> 
    <script src="js/directives.js"></script> 

    </head> 
    <body ng-app="app" animation="slide-left-right-ios7"> 
    <div> 

<ion-side-menus enable-menu-with-back-views="false" data-componentid="side-menu21"> 
    <ion-side-menu-content> 
     <ion-nav-bar class="bar-assertive"> 
      <ion-nav-back-button class="button-icon icon ion-ios-arrow-back"> </ion-nav-back-button> 

      <ion-nav-buttons side="left"> 
       <button class="button button-icon button-clear ion-navicon" menu-toggle="left"></button> 
      </ion-nav-buttons> 

      <ion-nav-buttons side="right"> 
       <button class="button button-icon button-clear ion-android-notifications" menu-toggle="right" ></button> 
      </ion-nav-buttons> 

     </ion-nav-bar> 
     <ion-nav-view></ion-nav-view> 
    </ion-side-menu-content> 

    <ion-side-menu side="left" id="side-menu21"> 

     <ion-header-bar class="bar-assertive"> 
      <div class="title">Menu</div> 
     </ion-header-bar> 

     <ion-content padding="false" class="side-menu-left has-header"> 

      <ion-list id="menu-list2" class=" " data-componentid="list2"> 

       <ion-item id="menu-list-item1" ui-sref="myProfile"> 
        <i class="icon ion-person" ></i> My Profile </ion-item> 

       <ion-item id="menu-list-item15" ui-sref="broadcast "> 
        <i class="icon ion-contrast" ></i> Broadcast </ion-item> 

      </ion-list> 

     </ion-content> 

    </ion-side-menu> 
</ion-side-menus> 

</div> 
    </body> 
</html> 

У меня есть сервис, который стреляет в логин, которые приносят мне мои органы

{ "authorities": 
     [ 
     "myProfile","broadcast" 
     ] 
} 

, что я позже хранить в localstorage нравится

window.localStorage.setItem("authority", data.authorities); 

Что я хочу сделать, показать или скрыть меню динамически в соответствии с полномочиями, которые я получил от входа?

например, в органах власти, если вместо "myProfile","broadcast" есть только "myProfile", тогда трансляция не должна отображаться в боковом меню.

+0

Что вы хотите скрыть и то, что вы хотите показать в боковом меню –

+0

проверьте страницу index.html. Я хочу скрыть/показать меню, которые не находятся в органах власти json – abhi314

ответ

1

Вы можете использовать директивы ng-hide или ng-if.

<ion-item ng-if="hasAuthority('broadcast')" id="menu-list-item15" ui-sref="broadcast "> 
        <i class="icon ion-contrast" ></i> Broadcast 
</ion-item> 

И тогда в контроллере есть функция

$scope.hasAuthority = function(auth){ 
    //code to check if localstorage has needed permission 
    //return true or false 
} 
Смежные вопросы