如何动态更改离子导航栏背景颜色

时间:2017-04-14 09:46:18

标签: html css angularjs ionic-framework

我是离子应用程序开发的新手,基本上我有一个收音机列表,用户可以从每个选项中选择选项我已经设置了背景颜色,我想要它做的是每当用户改变背景颜色选择一个选项。问题是它更改为初始选项但在初始加载后它没有改变颜色,但是当我检查页面时我可以看到它已经改变了类名。

这是我的HTML

<ion-nav-bar class="bar-{{viewColor}} nav-title-slide-ios7" align-title="center">
  <ion-nav-back-button class="button-icon ion-arrow-left-c">
  </ion-nav-back-button>
</ion-nav-bar>

这就是我在js

中分配viewColor变量的方法
$scope.viewColor = "positive";

提前致谢

2 个答案:

答案 0 :(得分:0)

尝试使用ionicView.beforeEnter方法,在页面加载完成之前设置viewcolor值。

self.listBox = Listbox(self.master,
                       selectmode='multiple',
                       height = 34,
                       width = 38)
self.listBox.grid(row = 3, column = 0, rowspan = 7, sticky = W)

答案 1 :(得分:0)

在使用不同的解决方案(没有工作)后,我最终使用了ion-header-bar而不是ion-nav-bar,它可以工作!颜色随用户选择动态变化。它唯一的缺点是我必须为每个视图创建一个标题并自己处理应用程序状态