не меняет цвет в заголовке бокового меню динамически

Мне нужно боковое меню, поэтому я использовал шаблон меню в моем проекте. Я пытаюсь использовать динамические цвета в заголовке. Я получил цвета для изменения соответственно в контенте, но мне нужно его изменить и в заголовке. Я пробовал без использования шаблона бокового меню. Когда я помещаю ионный заголовок на ту же страницу, где отображается мое содержимое, цвет заголовка меняется, но боковое меню не работает. Есть ли какой-нибудь механизм для этого?не меняет цвет в заголовке бокового меню динамически

контроллер приложения

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


     //id is passed as the parameter 
     .state('sidemenu.chapters',{ 
     url:'/chapters/:id', 
     views:{ 
      'menuContent':{ 
      templateUrl:'templates/chapters.html', 
      controller: 'ChaptersCtrl' 
      } 
     } 
     })

В моей ChaptersCtrl, у меня есть значение, необходимое для изменения цвета, но я не могу использовать его в sidemenu.html.

sidemenu.html

<ion-side-menus enable-menu-with-back-views="false"> 
    <ion-side-menu-content drag-content="false"> 
     <ion-nav-bar class="dark header header-height"> 
     <ion-nav-back-button> 
     </ion-nav-back-button> 

     <ion-nav-buttons side="left"> 
      <button class="button button-dark button-icon button-clear ion-navicon" menu-toggle="left"> 
      </button> 
     </ion-nav-buttons> 
     </ion-nav-bar> 
     <ion-nav-view name="menuContent"></ion-nav-view> 
    </ion-side-menu-content> 

    <ion-side-menu side="left"> 
    <ion-content class="has-header"> 
     <ion-list> 
     <ion-item menu-close class="item item-icon-left" href="#/content"> 
      <i class="icon ion-bookmark"></i> 
      Table of Content 
     </ion-item> 

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

источник

2016-04-12 Naruto

Что вы хотите достичь? Я не понимаю, какой-то код или плункер был бы полезен. –

Вы можете добиться этого с помощью $rootScope и ng-class.

$rootScope работает так же, как $scope, за исключением того, что переменная будет доступна через все приложение. Вы можете использовать это, чтобы задать имя класса в переменной при вводе определенной страницы. Скажем $rootScope.headClass = "mycustomclass".

После этого вы можете добавить аргумент ng-class в заголовок вашего бокового меню. ng-class гарантирует, что ваша строка преобразуется в класс. Таким образом, вы добавили бы ng-class = "{{headClass}}" в свой ионный заголовок в sidemenu.

источник

2016-04-12 10:00:27

Спасибо за ваше предложение, но я не мог использовать $ rootScope и ng-класс в моем проекте, так как мой шаблон sidemenu является абстрактным шаблоном. – Naruto

Да, вы можете. Вы можете использовать ng-класс в html вашего абстрактного шаблона. И после этого корневой файл $$$ можно использовать от каждого контроллера, так как это изменяет объем всего приложения. –

Мне удалось получить значение, но я не знаю, как использовать это значение в css. Можете ли вы дать простое демо. У меня есть «цвет: # 808080», поэтому я хочу, чтобы он использовался в качестве фона. – Naruto

Я не знаю, если это здорово, но я сделал это нравится:

if (counter == 10) { $rootScope.final = 'color:red;'; }

<button class="button button-counter"> <span style="{{final}}">{{timer}}</span> </button>

источник

2016-11-21 18:01:11

не меняет цвет в заголовке бокового меню динамически

ответ

Смежные вопросы