Hiding ion-nav-bar in 1.0 beta

ionic-v1
1

In 0.9.27 you could hide the nav-bar on one page by using <ion-view hide-nav-bar="true">. In the 1.0 beta this doesn’t work anymore.

How can the nav-bar be hidden on one page? I’ve tried using $ionicNavBarDelegate.showBar(false); in the controller for the page I want to hide the NavBar, but it doesn’t seem to work. Anyone?

2

Odd, it says it should in the docs. Do you mind posting a codepen so i could take a look?

3

Scratch that- hide-nav-bar=“true” actually works, I just didn’t see it due to the fact my nav-bar has a white background and .pane by default has a white background as well. So it looked like it wasn’t hiding when in fact it was. Chalk it up to it being a Friday :wink:

1 Like
4

Ha I hear you, early friday mornings. Glad to hear you got it resolved

1 Like
5

I am having trouble hiding the nav-bar, too.

In my index.html I have got the following:

...
<ion-nav-bar></ion-nav-bar>
<ion-nav-view></ion-nav-view>

and in my templates if I want to show the nav-bar:

<ion-view title="Conversations">

And that works. It shows the title. If I want to hide the nav-bar I write:

<ion-view hide-nav-bar="true">

But the (empty) nav bar is still there. Any idea why that is?

Thank you!

6

Is there a way to do it from JS? Somewhere from controller function.

7 
$ionicNavBarDelegate.showBar(false);

did the magic

2 Likes
8

I’m having a problem that when the navbar is hidden, any content in <ion-view /> bleeds into the status bar. Anyone else have this issue?

9

@seanhill I think your probably needs to conditionally show the has-header using ng-class