hide-nav-bar 也隐藏了导航按钮。我想保留视图标题和 ion-nav-buttons

Question

我添加了 hide-nav-bar 属性，希望隐藏个人资料页面上的导航栏。它会移除整个导航栏以及按钮和标题。

个人资料.html

<ion-view view-title="Profile" hide-nav-bar="true">
    <ion-content>
    </ion-content>
    <ion-footer-bar align-title="left" class="bar-balanced">
        <a class="button-icon title" href="">
            <i class="icon ion-ios-telephone-outline"></i>
        </a>
    </ion-footer-bar>
</ion-view>

侧边菜单代码 sn-p ：

 <ion-side-menu-content>
        <ion-nav-bar class="bar-balanced">
            <ion-nav-back-button>
            </ion-nav-back-button>

            <ion-nav-buttons side="left">
                <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
                </button>
            </ion-nav-buttons>
        </ion-nav-bar>
        <ion-nav-view name="menuContent"></ion-nav-view>
    </ion-side-menu-content>

是否有任何 CSS 或 Angular 解决方法？

我想保留 nav-back-button 和 nav-buttons 以及视图标题。我该怎么做？

我研究了一些方法，但这些方法需要 cordova 插件并且是 iOS 特定的，例如：http://ionicframework.jp/tutorials/fullscreen-apps/

还有

这个：http://codepen.io/ciastek/pen/lxmyC

这些不符合我的目的。请建议一个替代方案，如 CSS 标题栏透明或一些 $ionic 委托，它与 angular 一起工作，只删除栏而不是按钮。

Answer 1

好了，事情就到这里了，做一个css类

.make-border-trasparent{
  background-color: rgba(0, 0, 0, 0.0) !important;
  border: none;
  .bar.bar-light {
    background-color: rgba(0,0,0,0) !important;
  }
}

现在使用 ng-class 和 conidtion 将此类添加到导航栏

<ion-nav-bar ng-class="{'make-border-trasparent': hideBar,'bar-balanced': !hideBar }">

对于你想让导航栏完全透明的页面，在那个特定的控制器上写下这一行

$rootScope.hideBar = true;

这只会使您的酒吧完全透明。按钮和其他内容将在导航栏上保持可见。