Меню перезагрузки Onsend от контроллера, чтобы скрыть пункты меню

Question

У меня есть скользящее меню с несколькими элементами списка. Я хочу изменить видимость некоторых элементов в соответствии с подписанным типом пользователя.

У меня есть 3 контроллера: LoginController, AppController, и я просто сделал MenuController.

Это мое меню:

<ons-template id="menu.html"> 
    <ons-page ng-controller="menuController" ng-init="initMenu()"> 
     <ons-list> 
     <ons-list-item modifier="tappable" onclick="menu.setMainPage('navigator.html', {closeMenu: true})"> 
      <ons-icon icon="ion-home" style="padding-bottom:2px;"></ons-icon> Home 
     </ons-list-item> 
     <ons-list-item modifier="tappable" ng-hide="{{isTypeA}}" onclick="menu.setMainPage('Page1.html', {closeMenu: true})"> 
      <ons-icon icon="ion-clipboard" style="padding-bottom:2px;"></ons-icon> Page 1 
     </ons-list-item> 
     <ons-list-item modifier="tappable" ng-hide="{{isTypeA}}" onclick="menu.setMainPage('Page2.html', {closeMenu: true})"> 
      <ons-icon icon="ion-loop" style="padding-bottom:2px;"></ons-icon> Page 2 
     </ons-list-item> 

     <ons-list-item modifier="tappable" ng-hide="{{isTypeA}}" onclick="menu.setMainPage('Page3.html', {closeMenu: true})"> 
      <ons-icon icon="ion-compose" style="padding-bottom:2px;"></ons-icon> Page 3 
     </ons-list-item> 
     <ons-list-item modifier="tappable" onclick="menu.setMainPage('Page4.html', {closeMenu: true})"> 
      <ons-icon icon="ion-gear-a" style="padding-bottom:2px;"></ons-icon> Settings 
     </ons-list-item> 
     </ons-list> 
    </ons-page> 
</ons-template> 

При входе в пользователе, контроллер меню загружает первый, так что функция инициализации уже сделана. Затем, когда пользователь вводит ключи в свои учетные данные и нажимает LOGIN, я использую службу для установки типа лицензии в переменной, но затем, когда приложение загружается, уже слишком поздно.

Как исправить эту проблему, поэтому сразу после входа в систему меню снова инициализируется, и ng-hide корректно скрывает/показывает все необходимые элементы?

Answer 1

Вам нужно написать массив menuList как свойство области действия, которые содержат поля, такие как showMenu и функцию, чтобы обновить поле меню (showMenu) после входа в

function menuController ($scope){ 
    // init menu 
    $scope.menuList = [{ 
     showMenu: true, 
     menuPage: 'Page1.html', 
     ... 
    }, 
    { showMenu: true, 
     menuPage: 'Page2.html', 
     ... 
    } 
    , ...]; 

    // call this function after logging in 
    function updateMenuAfterLogin() { 
     menuList.foreach (function(menu){ 
      if ('someCondition') { 
       menu.showMenu= false; 
      } 
     } 
    } 

} 

Затем написать нг-повторять визуализации списка:

 <ons-list> 
     <ons-list-item modifier="tappable" ng-repeat= "menuItem in menuList" ng-hide="{{menuItem.show}}" onclick="menu.setMainPage({{menuItem.menuPage}}, {closeMenu: true})"> 
      <ons-icon icon="ion-home" style="padding-bottom:2px;"></ons-icon> Home 
     </ons-list-item> 
    </ons-list> 

Answer 2

Я вижу 2 пути решения этой проблемы:

1. Как исправить эту проблему, поэтому сразу после входа в систему меню снова инициализируется, и ng-hide корректно скрывает/показывает все необходимые элементы?

   Это первый способ - после входа в систему вы можете просто перезагрузить страницу меню menu.setMenuPage('menu.html') или что-нибудь подобное, которое будет явно вносить изменения.
   
   

2. Кроме того, так как вы говорите, что

   Я использую услугу, чтобы установить тип лицензии в переменной

   Вы можете просто сделать эту переменную видимым для просмотра и использования это для вашего ng-show/ng-hide. Вот простой Demo, чтобы увидеть его в действии.

   В основном, это то, что мы получаем от привязки двухсторонней привязки углов - мы можем даже переключать значение между true и false, и пункты соответственно будут обновляться.

Выбор за вами. Я думаю, что второй чувствует себя ближе к «Угловому пути», но если вы предпочитаете четко устанавливать вещи, это тоже прекрасно, так как это сработало для нас задолго до того, как был изобретен Угловой.