Problem Changing colors dynamically on sidemenu demo


I’m writing an “sidemenu” type of app (based on the sidemenu demo/starter) that allows the user to choose a theme (basically, the bars and buttons colors).
The problem is when an user clicks a button to change dynamically the theme, it only changes the color of the menu’s header and not the color of the views header (stays always in the first color of the array).
Here is a codepen example (just click on the “CHANGE COLOR” button on the side menu):

Can anyone tell me what i’m doing wrong?


The problem is that when you apply new class to <ion-nav-bar> with bar-{{temabar}} it isn’t changing the correct element. New class has to be applied to <ion-header-bar> element in order to have effect.
One way you could do that is by applying new classes directly on all <ion-header-bar> elements in your changeTheme function.
Take a look at this new codepen:

1 Like

I think this is an ionic issue ( but your solution worked like a charm. Thanks.