Q:

How to resize Ionic main contents when toggling a subheader using ngIf

I am trying to toggle an Ionic sub header on/off using an ngIf as in the following
<div class="bar bar-subheader" ng-if=showSubheader>
    <h2 class="title">Sub Header</h2>        
 </div>

 <ion-content class="has-subheader">
    <div data-ng-include="'app/main/main.html'"></div>
 </ion-content>

And setting the $scope.showSubheader to true / false. The sub menu shows/hide fine, but the main content does not resize when the sub header is toggled. 
I have tried adding an adding/removing the class has-subheader in the code behind, and calling $scope.apply(), but nothing seems to "refresh" the main contents height. If I have the class="has-subheader" there initially, then there is always a space for the subheader, visible or not, if I don't have it there, then the subheader covers the top of the main contents.
I had trouble getting a plunk to show the Ionic headers, so haven't made one at this stage (hoping this description will be enough)
Also, I am using this inside of an Ionic splitview...
<ion-side-menus>
<ion-side-menu-content>
    <ion-header-bar class="bar-positive">
        <button class="button button-icon ion-navicon" ng-click="vm.toggleLeft()" ng-hide="$exposeAside.active"></button>
        <h1 style="text-align: left" class="title">Title</h1>            
    </ion-header-bar>

    <div class="bar bar-subheader" ng-if=showSubheader>
     <h2 class="title">Sub Header</h2>        
   </div>

    <ion-content id="maincontent" class="padding has-subheader">
        <div data-ng-include="'app/main/main.html'"></div>
    </ion-content>

  <ion-footer-bar align-title="left" class="bar-balanced"></ion-footer-bar>
</ion-side-menu-content>

<ion-side-menu width={{vm.menuwidth}} expose-aside-when={{vm.exposewhen}}>
    <ion-header-bar class="bar-royal">
        <h1 style="text-align: left" class="title">Options</h1>
    </ion-header-bar>
    <ion-content>
        <div data-ng-include="'app/options/options.html'"></div>
    </ion-content>
</ion-side-menu>

Does anyone know a way around this?
Thanks in advance for any suggestions!

A:

may be this can be one direction..!
 <div ng-class="{' bar bar-subheader':(showSubheader)}" >
    <h2 class="title">Sub Header</h2>
 </div>

similarly, try for has-subheader class in <ion-content>

