zachfitz/Ionic-Material

How to hide a nav bar in a Ionic Material project?

Closed this issue · 2 comments

rig1 commented

I am trying to hide a nav bar in an Ionic Material project. Can anyone tell how to do it. i tried hide-nav-bar="true" but it doesn't helped me.

$scope.hideNavBar = function() {
    document.getElementsByTagName('ion-nav-bar')[0].style.display = 'none';
};
$scope.noHeader = function() {
    var content = document.getElementsByTagName('ion-content');
    for (var i = 0; i < content.length; i++) {
        if (content[i].classList.contains('has-header')) {
            content[i].classList.toggle('has-header');
        }
    }
};

$scope.showNavBar = function() {
    document.getElementsByTagName('ion-nav-bar')[0].style.display = 'block';
};
$scope.hasHeader = function() {
    var content = document.getElementsByTagName('ion-content');
    for (var i = 0; i < content.length; i++) {
        if (!content[i].classList.contains('has-header')) {
            content[i].classList.toggle('has-header');
        }
    }
};

$scope.hideHeader = function() {
    $scope.hideNavBar();
    $scope.noHeader();
};
$scope.showHeader = function() {
    $scope.showNavBar();
    $scope.hasHeader();
};

Then:

$timeout(function() {
    $scope.$parent.hideHeader();
}, 0);
rig1 commented

Thanks aazbeltran. It's working