Hiding the Ionic Framework Header based on screen orientation

问题

I would like to ask if there is a way to hide a nav bar of the ionic framework on a particular view upon changing in the screen orientation from portrait to landscape.

回答1:

Yes you can, it's very easy.

This is a function you need to trigger to hide a navbar:

$ionicNavBarDelegate.showBar(false); 

Of course, do it inside an appropriate Controller.

The second part of this formula is Cordova Orientation plugin, click here.

So when combined you would want something like this:

if(screen.orientation == 'landscape') {
    $ionicNavBarDelegate.showBar(false); 
}

There's also a JavaScript approach to detect an orientation, but it's a hit and miss solution on some devices. Cordova plugin i much safer solution.

This is not everything, what if user change orientation after view initialization:

window.addEventListener('orientationchange', doOnOrientationChange);

// Initial execution if needed
doOnOrientationChange();

function doOnOrientationChange()
{
    if(screen.orientation == 'landscape') {
        $ionicNavBarDelegate.showBar(false); 
    }        
}

来源：https://stackoverflow.com/questions/32346428/hiding-the-ionic-framework-header-based-on-screen-orientation