离子中的菜单关闭属性使后退按钮消失答案

【问题标题】：menu-close attritube in ionic makes back button disappears离子中的菜单关闭属性使后退按钮消失
【发布时间】：2017-05-23 04:33:47
【问题描述】：

我正在开发一个 ionic 项目，我同时使用了 sidemenu 和 tabs 模板，我意识到当我单击 sidemenu 中的任何链接并导航时，没有显示后退按钮我从它导航的脚本中取出菜单关闭，然后显示后退按钮而不关闭侧面菜单。我可以找到一种方法来解决如何在侧边菜单关闭时显示后退按钮

<ion-side-menus enable-menu-with-back-views="true">
  <ion-side-menu-content>
    <ion-nav-bar class="bar-assertive" align-title="center">
      <ion-nav-back-button>
      </ion-nav-back-button>

      <ion-nav-buttons side="right">
        <button class="button button-icon button-clear ion-navicon" menu-toggle="right">
        </button>
      </ion-nav-buttons>
            <ion-nav-title>
     <img src="img/logo_white.png" width="60" height="30" style="position:relative; top:7px" />

    </ion-nav-title>
    </ion-nav-bar>

<ion-tabs class="tabs-icon-top tabs-color-active-assertive tabs-stable">

  <!-- Dashboard Tab -->
  <ion-tab title="Home" icon="ion-android-home"  href="#/tab/home">
    <ion-nav-view name="tab-home"></ion-nav-view>
  </ion-tab>

  <!-- Chats Tab -->
  <ion-tab title="News" icon="ion-ios-paper"  href="#/tab/news">
    <ion-nav-view name="tab-news"></ion-nav-view>
  </ion-tab>

  <!-- Account Tab -->
  <ion-tab title="Livescore" icon="ion-ios-football"  href="#/tab/livescore">
    <ion-nav-view name="tab-livescore"></ion-nav-view>
  </ion-tab>

    <!-- Account Tab -->
  <ion-tab title="Highlights" icon="ion-play"  href="#/tab/highlights">
    <ion-nav-view name="tab-highlights"></ion-nav-view>
  </ion-tab>
</ion-tabs>

  </ion-side-menu-content>

   <!-- Side Menu (right) -->
  <ion-side-menu side="right">
    <ion-header-bar class="bar-assertive">
      <h1 class="title">APP</h1>
    </ion-header-bar>
    <ion-content>
      <ion-list>

         <ion-item menu-close href="#/tab/home">
          <i class="ion-home"></i> Home
        </ion-item>

       <ion-item menu-close href="#/tab/myteams">
          <i class="ion-android-star"></i> My Teams 
        </ion-item>




      </ion-list>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

【问题讨论】：

标签： ionic-framework

【解决方案1】：

我建议您通过Any way to -not- reset history stack on menu-close? 进行讨论。根据 Ionic 文档，menu close 将重置历史堆栈。

在sidebar.html中，使用（例如）

<ion-item ng-click="closeMenu()" ui-sref="app.report">Report</ion-item>

代替：

<ion-item menu-close href="#/app/report">Report</ion-item>

并将 closeMenu() 定义为：

$scope.closeMenu = function() {
  $ionicHistory.nextViewOptions({disableAnimate: true});
  $ionicSideMenuDelegate.toggleLeft();
}

在您应用的主控制器中（例如在 app.js 中）：

  .state('app', {
    url: '/app',
    abstract: true,
    templateUrl: 'templates/sidebar.html',
    controller: 'AppCtrl'
  })

不要忘记同时注入 $ionicHistory 和 $ionicSideMenuDelegate。

有了这个，“报告”（来自侧边栏）现在应该有返回按钮了。

【讨论】：