Javascript 离子框架 $state.go('app.home'); 在我想去的页面上添加后退按钮（如何删除它）？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27930702/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Ionic framework $state.go('app.home'); is adding back button on page where i want to go (how to remove it)?
提问by redrom
I have app with sidebar menu. I am on second page and i'm calling controller function which redirect me to first page using:
我有带有侧边栏菜单的应用程序。我在第二页，我正在调用控制器函数，它使用以下命令将我重定向到第一页：
$state.go('app.home');
Problem is that on this page is now displayed back button next sidebar menu icon, see image below:
问题是在这个页面上现在显示后退按钮旁边的侧边栏菜单图标，见下图：
Could somebody tell me how to deny to add back button into pages which has assigned sidebar menu?
有人能告诉我如何拒绝在分配了侧边栏菜单的页面中添加后退按钮吗？
Thanks for any help.
谢谢你的帮助。
app.js is with router config is following:
app.js 与路由器配置如下：
angular.module('Test', ['ionic', 'config', 'Test', 'LocalStorageModule'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if(window.StatusBar) {
// org.apache.cordova.statusbar required
StatusBar.styleDefault();
}
});
})
.config(function($stateProvider, $urlRouterProvider, localStorageServiceProvider) {
localStorageServiceProvider
.setPrefix('max_relax');
$stateProvider
.state('app', {
url: '/app',
abstract: true,
templateUrl: 'templates/menu.html',
controller: 'AppCtrl'
})
.state('app.home', {
url: '/home',
views: {
'menuContent' :{
templateUrl: 'templates/home.html',
controller: 'HomeCtrl'
}
}
})
.state('app.saved', {
url: '/saved',
views: {
'menuContent' :{
templateUrl: 'templates/saved.html',
controller: 'SavedCtrl'
}
}
})
.state('app.settings', {
url: '/settings',
views: {
'menuContent' :{
templateUrl: 'templates/settings.html',
controller: 'SettingsCtrl'
}
}
});
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/app/home');
});
Edit:
编辑：
Added menu template:
添加菜单模板：
<ion-side-menus>
<ion-pane ion-side-menu-content>
<ion-nav-bar class="bar-stable">
<ion-nav-back-button class="button-clear"><i class="icon ion-ios7-arrow-back"></i> Back</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
</ion-pane>
<ion-side-menu side="left">
<header class="bar bar-header bar-stable">
<h1 class="title">Menu</h1>
</header>
<ion-content class="has-header">
<ion-list>
<ion-item nav-clear menu-close href="#/app/home">
Home
</ion-item>
<ion-item nav-clear menu-close href="#/app/saved">
Saved
</ion-item>
<ion-item nav-clear menu-close href="#/app/settings">
Settings
</ion-item>
</ion-list>
</ion-content>
</ion-side-menu>
</ion-side-menus>
回答by Bellu
Use $ionicHistoryin your controller before calling $state.go('app.home').
$ionicHistory在调用之前在您的控制器中使用$state.go('app.home')。
.controller('HomeCtrl', function($scope,...,$ionicHistory) {
...
$ionicHistory.nextViewOptions({
disableBack: true
});
$state.go('app.home');
});
回答by Shripal Soni
You can set nextViewOptions before $state.go('Yourstate'). Like In your controller, you can write,
您可以在 $state.go('Yourstate') 之前设置 nextViewOptions。就像在你的控制器中，你可以写，
$ionicHistory.nextViewOptions({
disableBack: true
});
$state.go('app.home');
So for that transition, it will clear the history stack and sets next view as root of the history stack.
因此，对于该转换，它将清除历史堆栈并将下一个视图设置为历史堆栈的根。
回答by HuyLe
At controller which you want to return HomeCtrl:
在您要返回的控制器上HomeCtrl：
.controller('SavedCtrl', function($scope,...,$ionicHistory) {
...
$ionicHistory.nextViewOptions({
disableBack: true
});
$state.go('app.home');
})
.controller('HomeCtrl', function($scope,...,$ionicHistory) {
$ionicHistory.clearHistory();
})
回答by Pavel Kushnirskiy
$ionicNavBarDelegate.showBackButton(false);
回答by leo
I had this problem too when using Ionic's side menu.
我在使用 Ionic 的侧边菜单时也遇到了这个问题。
In some cases when selecting an option from the side menu the resulting page/view was showing a back button in the navbar, which it shouldn't (because selecting a menu option should reset the history).
在某些情况下，当从侧边菜单中选择一个选项时，结果页面/视图在导航栏中显示了一个后退按钮，它不应该（因为选择菜单选项应该重置历史记录）。
The problem was related to using "ng-click" in the menu option, e.g:
问题与在菜单选项中使用“ng-click”有关，例如：
<ion-item menu-close ng-click="showStartPage()" ...>
<ion-item menu-close ng-click="showStartPage()" ...>
with 'showStartPage' being a Controller method which calls $state.go(...).
'showStartPage' 是一个调用 $state.go(...) 的控制器方法。
Solution was to code it like this:
解决方案是这样编码：
<ion-item menu-close href="#/startPage" ...>
<ion-item menu-close href="#/startPage" ...>
When done like this, Ionic is (apparently) able to properly keep track of the navigation history.
这样做时，Ionic（显然）能够正确跟踪导航历史记录。
(I didn't try it out but probably "ui-sref" instead of "href" would work too)
（我没有尝试过，但可能“ui-sref”而不是“href”也可以）
回答by Josh Durham
As long as you have <ion-nav-back-button></ion-nav-back-button>included in <ion-nav-bar>you will see a back button by default on any view using app.
只要您<ion-nav-back-button></ion-nav-back-button>包含在<ion-nav-bar>，默认情况下，您将在任何使用app.
Removing <ion-nav-back-button>will remove the back button from all of the views using app. You can selectively disable it based on what template your viewing by setting hide-back-button="true"on the <ion-view>of that template.
删除<ion-nav-back-button>将从所有使用 的视图中删除后退按钮app。您可以根据设定哪个模板您的观看选择禁用它hide-back-button="true"在<ion-view>该模板的。
So, in your case, removing <ion-nav-back-button class="button-clear"><i class="icon ion-ios7-arrow-back"></i> Back</ion-nav-back-button>from menu.htmlwill hide the back button on all views using app.
因此，在您的情况下，<ion-nav-back-button class="button-clear"><i class="icon ion-ios7-arrow-back"></i> Back</ion-nav-back-button>从menu.html使用app.
