Question

我正在尝试隐藏离子ion-nav-bar而不隐藏ion-nav-bar按钮的可能方法。
我试过了

hide-nav-bar="true"

但它也隐藏了按钮。我搜索过并提到了this，但没有解决我的问题。
问候。

Answer 1

您只需指定要隐藏栏的状态，并修改某些样式

<强> JS：

$rootScope.$on('$stateChangeStart', function(ev, toState, toParams, fromState, fromParams){

    var states = ['tabs.about', 'tabs.contact'];

    if(states.indexOf(toState.name) > -1) {
      $rootScope.hideBar=true;
    } else {
      $rootScope.hideBar=false;
    }
});

<强> HTML：

<ion-nav-bar class="bar-positive" ng-class="{ 'make-border-trasparent': hideBar }">
  <ion-nav-back-button>
  </ion-nav-back-button>
</ion-nav-bar>

请看一下这个例子（我隐藏了tabs.about和tabs.contact州的条形图）

Codepen

离子隐藏导航栏而不是按钮

1 个答案: