Dynamically add and remove subheader

ionic-v1
1

For my app a subheader that shows up when there is no internet connection and disappears when there is. (Like facebook messenger app for android)

The problem is when I hide the subheader then the space where the subheader was is still visible. When it comes back it sometimes hides some of the content.

I really liked working with Ionic so far, can someone help me out please?

<ion-view view-title="Complexen">

    <ion-header-bar class="bar bar-subheader bar-assertive" ng-hide="hasInternet">
        <h1 class="title" style="text-align:center">Onlinestatus: {{hasInternet}}</h1>
    </ion-header-bar>

    <ion-content class="has-header">

    </ion-content>
</ion-view>
2

You can use ng-if and dynamically add the has-subheader class. See this codepen

1 Like
3

Works perfect! Thank you very much!

1 Like