Ionic-tab ng-if is changing tabs order

@iontofer wrote:

Guys,

My logic is as follows:

1.- I have a tab app
2.- If the user is admin, then I will show him an extra tab option
3.- If the user is not admin, then I will hide the admin tab

My code is:

  <!-- First Tab -->
  <ion-tab title="{{ 'tab-first' | translate }}." icon="ion-alert-circled" href="#/tab/first">
    <ion-nav-view name="tab-first"></ion-nav-view>
  </ion-tab>

  <!-- Second Tab (***Admin view***) -->
  <ion-tab title="{{ 'tab-second' | translate}}" icon="ion-person-stalker" href="#/tab/second" ng-if="$root.admin">
    <ion-nav-view name="tab-second"></ion-nav-view>
  </ion-tab>

  <!-- Third Tab -->
  <ion-tab title="{{ 'tab-third' | translate }}" icon="ion-arrow-swap" href="#/tab/third">
    <ion-nav-view name="tab-third"></ion-nav-view>
  </ion-tab>

I have the rootScope.admin on my SignInCtrl, the show/hide operation is working, but the problem is that when the user is admin, the Second Tab's position is at the end of the tabs menu, but not in the second position.

How can I force to the tab menu to show the Second Tab on the Second position but not the third one?

(I tried with ng-show but is just not working on this case)

ionic info

Your system information:

Cordova CLI: 5.4.0
Gulp version: CLI version 3.9.0
Gulp local:
Ionic CLI Version: 1.7.14
Ionic App Lib Version: 0.7.0
ios-deploy version: 1.7.0
ios-sim version: 3.0.0
OS: Mac OS X El Capitan
Node Version: v0.12.6
Xcode version: Xcode 7.2.1 Build version 7C1002

Thanks guys!

Posts: 1

Participants: 1

Read full topic