javascript - 在 Ionic/Angular JS 中删除基于侧菜单的模板中的导航栏

标签 javascript angularjs ionic-framework

我使用 Ionic 框架创建了一个应用程序,它运行得很好。它基于侧菜单模板,因此我总是在应用程序顶部有一个导航栏。

<ion-side-menus enable-menu-with-back-views="false">
  <ion-side-menu-content>
    <ion-nav-bar class="bar-calm">
      <ion-nav-back-button></ion-nav-back-button>
      <ion-nav-buttons side="left">
        <button class="button button-icon button-clear ion-navicon-round" menu-toggle="left"></button>
      </ion-nav-buttons>
    </ion-nav-bar>
    <ion-nav-view name="menuContent"></ion-nav-view>
  </ion-side-menu-content>
  <ion-side-menu side="left">
    <ion-content>
      <a menu-close href="#/app/bla">
        <div id="profile-item">
          <i class="icon ion-card"></i> Bla
        </div>
      </a>
      <a menu-close href="#/app/register">
        <div id="profile-item">
          <i class="icon ion-card"></i> Sign-up
        </div>
      </a>
      <a menu-close href="#/app/login">
        <div id="profile-item">
          <i class="icon ion-card"></i> Login
        </div>
      </a>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

app.js:

$stateProvider.state('app.login', {
  url: '/login',
  views: {
    'menuContent': {
      templateUrl: 'templates/login.html',
      controller: 'LoginCtrl'
    }
  }
})

$stateProvider.state('app.start', {
  url: '/start',
  views: {
    'menuContent': {
      templateUrl: 'templates/start.html',
      controller: 'StartsCtrl'
    }
  }
})

现在对于注册和登录 View ,我根本不想显示导航栏。如何在特定 View 上删除它?我发现这很难,因为导航栏是在 menu.html 中定义的,它在 View 之前调用。

最佳答案

我必须修改 app.js 中的路由定义:

$stateProvider.state('login', {
  url: '/login',
  templateUrl: 'templates/login.html',
  controller: 'LoginCtrl'
})

$stateProvider.state('start', {
  url: '/start',
  templateUrl: 'templates/start.html',
  controller: 'StartsCtrl'
})

仅删除toogle按钮不起作用,因为用户仍然可以在屏幕上向右滑动以显示菜单。

关于javascript - 在 Ionic/Angular JS 中删除基于侧菜单的模板中的导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34567900/

相关文章:

angularjs - 对底层数组进行更改时,ng-repeat 不会重新排序

javascript - 在 AngularJS 中提交后重置表单

javascript - 在 swipe 中使用 ng-click 功能 - ionic v1

javascript - 左上角的谷歌地图中心

javascript奇怪的编码

angularjs - Angular 路由参数约束

android - 关闭后如何在 ionic 框架中保存/加载 Web 应用程序设置?

css - 在 Ionic 1.3 中禁用 native 滚动

javascript - 以编程方式在 BorderContainer 中创建的 AccordionContainer 存在大小问题

javascript - 在迭代期间在每个容器中复制图像