Hide a ion-tab

ionic-v1
1

Hi,

I’m currently trying to make a tab app using ionic.
I want to hide a tab based on a variable inside a controller.

I saw the hidden property and set it to an hardcoded true and it works, however It doesn’t work when trying to use the controller variable. Same with the angular ng-hide and ng-show attributes.

my code :
My controller :

.controller('AuthCtrl', function($scope) {
	$scope.isLoggedIn = true;
})

my html file :

<ion-tabs ng-controller="AuthCtrl as auth" class="tabs-icon-top tabs-color-active-positive" >
	<p>{{isLoggedIn}}</p>
  <ion-tab  title="Login" icon-off="ion-gear-a" icon-on="ion-gear-a" href="#/tab/login" ng-hide="isLoggedIn" hidden="isLoggedIn">
    <ion-nav-view  name="tab-login" ></ion-nav-view>
  </ion-tab>
</ion-tabs>

Note : the display of the var is correct and show true.
Can you see what my problem is ?

Thank you.

Valentin

2

I found the solution.
Instead of using hidden, ng-show or ng-hide I can use ng-if will hide the tab.

Thanks

1 Like
3

Hello @vbastien, I am new in IONIC. I am developing an app that has login and signup pages. After login, i want to show tabs. But in Login page, i want to hide tab. So, I read your post.can you please describe your code.Especially HTML file.

Thank you:slight_smile:

4

Hi,
You can hide it in the controller.
for example if it’s named LoginController:
.controller('LoginController', function($scope, $ionicTabsDelegate) {
$ionicTabsDelegate.showBar(false);
});