Menu
i want to create nav back button in an ion-view. I try this code:
<ion-view view-title="Event details">
<ion-nav-back-button class="button-clear">
<i class="ion-arrow-left-c"></i> Back
</ion-nav-back-button>
<ion-content >
</ion-content>
</ion-nav-view>
But i don't get the button. Any kind of help is appreciated.
719
The Back button wont show up if there is no history. History gets deleted when the page or app is refreshed. This is very common while developing in a browser. But this wont be the case in a device as you cannot refresh the app.
First way to show back button
in index.html
<body ng-app="starter" ng-controller="AppCtrl" class="">
<ion-nav-bar id="mainNav" class="bar-dark">
<ion-nav-back-button class="button-clear">
<i class="icon ion-ios-arrow-back"></i>
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view animation="slide-left-right" class="scFont appFontSmall"></ion-nav-view>
</body>
Second way to show back button is to handle it by your own. index.html can have the same code as above. but a view will have something like this
<ion-view view-title="Title" hide-back-button="true">
<ion-nav-buttons side="left">
<a ng-click="goBackState()" class="button button-icon icon ion-ios-arrow-back"></a>
</ion-nav-buttons>
<ion-content>
</ion-content
</ion-view>
The goBackState() is a function you might want to place inside your app.run function
$rootScope.goBackState = function(){
$ionicViewSwitcher.nextDirection('back');
$ionicHistory.goBack();
}
But remember this function also won't work if there is no history. Hope this helps
179
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
