Question

我正在开发一个离子框架应用程序，我只需要隐藏特定模板上的菜单按钮，但需要保留按钮。

它显示为

我的app.js

// setup an abstract state for the tabs directive
  .state('app', {
    url: '/app',
    cache: false,
    abstract: true,
    templateUrl: 'templates/menu.html',
  })


  .state('app.home', {
    url: '/home',
    cache: false,
    views: {
      'menuContent': {
        templateUrl: 'templates/home.html',
        controller: 'DashCtrl'
      }
    }
  })

  .state('app.models', {
      url: '/models',
      cache: false,
      views: {
        'menuContent': {
          templateUrl: 'templates/models.html',
          controller: 'ModelCtrl'
        }
      }
    })

    .state('app.model', {
      url: '/model/:Id',
      cache: false,
      views: {
        'menuContent': {
          templateUrl: 'templates/models-data.html',
          controller: 'ModeldataCtrl'
        }
      }
    })

    .state('app.models-detail', {
      url: '/models/:Id',
      cache: false,
      views: {
        'menuContent': {
          templateUrl: 'templates/single-model.html',
          controller: 'ModelDetailCtrl'
        }
      }
    })

  .state('app.about', {
    url: '/about',
    cache: false,
    views: {
        'menuContent': {
          templateUrl: 'templates/about.html',
          controller: 'AboutCtrl'
        }
      }
  });

  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('/app/home');

});

Menu html是：

<ion-side-menus enable-menu-with-back-views="true">
  <ion-side-menu-content>
    <ion-nav-bar class="bar-stable">
      <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>

  <ion-side-menu side="left">
    <ion-header-bar class="bar-stable">
      <h1 class="title">Rolls</h1>
    </ion-header-bar>
    <ion-content>
      <ion-list>
        <ion-item menu-close href="#/app/home">
          Home
        </ion-item>
        <ion-item menu-close href="#/app/models">
          Models
        </ion-item>
        <ion-item menu-close href="#/app/about">
          About
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

单模型html页面，我得到菜单和后退按钮代码：single-model.html

<ion-view view-title="{{models.title}}">
  <ion-content class="padding" overflow-scroll="true">
    <img ng-src="{{models.image}}" style="width: 64px; height: 64px">
    <p>
      {{models.subtitle}}
    </p>
  </ion-content>
</ion-view>

模型和单一模型控制器代码是：

.controller('ModeldataCtrl', function($rootScope,$scope,$ionicLoading,$timeout, $stateParams, Models) {     
      $rootScope.dataloarding();
      Models.modeldata($stateParams.Id).success(function(result){
        if(result.success =='1'){
                  $scope.modeldata = result.data;
                  $rootScope.hideloading();
                }

              })
              .error(function(result)
                     {
                      $rootScope.hideloading();
                      $rootScope.showAlert("Internet Connection Error");
              });
})

.controller('ModelDetailCtrl', function($rootScope,$scope,$ionicLoading,$timeout, $stateParams,$ionicSideMenuDelegate, Models) {
      $ionicSideMenuDelegate.canDragContent(false);
      $rootScope.dataloarding();
      Models.singlemodel($stateParams.Id).success(function(result){
        if(result.success =='1'){
                  $scope.models = result.data;
                  $rootScope.hideloading();
                }

              })
              .error(function(result)
                     {
                      $rootScope.hideloading();
                      $rootScope.showAlert("Internet Connection Error");
              });
})

我关注this和this，但它同时删除了后退按钮和菜单以及后退按钮。

是否有解决方案仅从单一模型html页面中删除菜单？

Answer 1

这对我有用：

<ion-view view-title="Register">

  <!-- to remove sidemenu button -->
  <ion-nav-bar>
    <ion-nav-back-button>
    </ion-nav-back-button>
  </ion-nav-bar>
...

我刚刚添加了一个简单的导航栏。侧面菜单按钮消失了，我保留了后退按钮。

Answer 2

你可以试试这个，它适合我。用以下代码替换您的侧边菜单内容

<ion-pane ion-side-menu-content>
<ion-nav-bar class="bar-stable">
  <ion-nav-back-button class="button-clear"><i class="icon ion-chevron-left"></i> Back</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>

离子隐藏菜单按钮但保持后退按钮

2 个答案: