Struggle with multiple different ion-header-bars

@wtfuii wrote:

Hello guys,

I'm fighting with header bars.

This snippet works perfectly fine:

   <ion-pane>
      <ion-header-bar class="bar-balanced">
        <h1 class="title">mytitle</h1>
      </ion-header-bar>
      <ion-view view-title="">
        <ion-content>
          MyContent
        </ion-content>
      </ion-view>
    </ion-pane>

This works like a charme.

Once I add two additional header bars for different conditions, my ion-content module doesn't get the has-header class and my header bar overlaps my content.

As said, this crashes my design:

   <ion-pane>
      <ion-header-bar class="bar-balanced" ng-show="conditionA()">
        <h1 class="title">mytitle1</h1>
      </ion-header-bar>
      <ion-header-bar class="bar-balanced" ng-show="conditionB()">
        <h1 class="title">mytitle2</h1>
      </ion-header-bar>
      <ion-header-bar class="bar-balanced" ng-show="conditionC()">
        <h1 class="title">mytitle3</h1>
      </ion-header-bar>
      <ion-view view-title="">
        <ion-content>
          MyContent
        </ion-content>
      </ion-view>
    </ion-pane>

Setting the has-header class manually doesn't solve the problem. The class gets removed by angular/ionic.
What am I doing wrong? It should be possible to set different headers, shouldn't it?
Thanks for your help in advance.

Posts: 1

Participants: 1

Read full topic