Style specificity on ion-nav-bar

ionic-v1
1

Hi.
I have an ion-nav-bar simple with a back button and a image centered.
the original background color is white. I need to override it to other color. I am doing this with ng-style. But, when the ion-nav-bar is rendered, it holds inside it an ion-header-bar that overrides by specificity my own color.
If I use an class in the ion-nav-bar, it works ok. but I need to use the ng-style.
Am I clear? how could I accomplish this?
thx in advance

2

Just use classes instead, those gets transferred onto the <ion-header-bar>.

3

thx for your attention.
but how? i have this:
$scope.bkgColor = {‘background-color’: ‘#420b0e’};
but if I use the ng-class=“bkgColor” in the element, it is translated only to “background-color” but without the value. I need that the attribute and value comes from some origin (as database) instead from the css file.

4

You can tell the bar to inherit the background color, see this codepen: http://codepen.io/brandyshea/pen/ZGQmYP

5

Hi.
nice trick, but I have not used .bar but .bar-header.
It worked perfectly. thank you