单击设备返回按钮可关闭应用程序,而不是返回上一页

Question

如果单击任何一个ion-item它打开所需的页面,但如果我单击设备后退按钮它关闭应用程序而不是回到android中的上一页:

这是我的离子侧菜单:

<ion-side-menus enable-menu-with-back-views="false">
  <ion-side-menu-content>
    <ion-nav-bar class="bar-positive">
      <ion-nav-back-button></ion-nav-back-button>
      <ion-nav-buttons side="left">
        <button class="button button-icon icon ion-android-menu" 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-positive">
      <h1 class="title"></h1>
    </ion-header-bar>
    <ion-content>
      <ion-list>
        <ion-item menu-close ng-click="login()">
          Login
        </ion-item>
        <ion-item menu-close ui-sref="app.search">
          Search
        </ion-item>
        <ion-item menu-close href="#/app/browse">
          Browse
        </ion-item>
        <ion-item menu-close href="#/app/playlists">
          Playlists
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

这是app.js:

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

  .state('app.search', {
    url: '/search',
    views: {
      'menuContent': {
        templateUrl: 'templates/search/default.html'
      }
    }
  })
  .state('app.search-form', {
    url: '/search-form',
    views: {
      'menuContent': {
        templateUrl: 'templates/search/search-form.html'
      }
    }
  })

我发现一个解决方案:

$ionicHistory.nextViewOptions({        
  disableBack: true,
  historyRoot: true
});      

因此,当您单击按钮并转到下一页时,这将禁用后退按钮.

Answer 1

后退按钮的默认行为如下:返回历史记录 - 如果历史堆栈为空 - >退出应用程序.

因此,当您点击硬件后退按钮时,您应该检查您所处的$状态.

使用以下代码(放置在模块的运行功能中),您可以覆盖默认行为.例如,您可以像这样禁用应用程序退出:

$ionicPlatform.registerBackButtonAction(function (event) {
  if($state.current.name=="app.home"){
    navigator.app.exitApp(); //<-- remove this line to disable the exit
  }
  else {
    navigator.app.backHistory();
  }
}, 100);

请参阅$ ionicPlatform的文档.

Answer 2

menu-close侧边菜单中的属性可以清除历史记录.您可以通过替换它来进行实验menu-toggle="left".这仍将关闭边栏但保留历史.

我最终覆盖了硬件后退键的行为,如下所示.在退回时,它会在退出应用程序之前将用户发送到起始视图.请注意,我仍然使用menu-close侧边菜单中的属性.另请注意,我碰巧存储了启动网址,window.localStorage["start_view"]因为它可以在我的应用中更改.希望它可以帮助/激励其他人解决这个问题.

$ionicPlatform.registerBackButtonAction(function(event) {
    if ($ionicHistory.backView() == null && $ionicHistory.currentView().url != window.localStorage["start_view"]) {
      // Goto start view
      console.log("-> Going to start view instead of exiting");
      $ionicHistory.currentView($ionicHistory.backView()); // to clean history.
      $rootScope.$apply(function() {
        $location.path(window.localStorage["start_view"]);
      });
    } else if ($ionicHistory.backView() == null && $ionicHistory.currentView().url == window.localStorage["start_view"]) {
      console.log("-> Exiting app");
      navigator.app.exitApp();
    } else {
      // Normal back
      console.log("-> Going back");
      $ionicHistory.goBack();
    }
  }, 100);