首页 文章

菜单关闭attritube in ionic使后退按钮消失

提问于
浏览
1

我正在研究一个离子项目,我正在使用sidemenu和tabs模板,我已经意识到当我点击侧面菜单中的任何链接并导航时,后退按钮不显示,当我拿出菜单 - 从我的脚本关闭它导航和后退按钮显示没有关闭侧面菜单 . 我可以找到一种方法,在侧面菜单关闭时如何使后退按钮显示

<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>

1 回答

  • 2

    我建议你在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 .

    有了这个,“报告”(来自侧边栏)现在应该有后退按钮 .

相关问题