@DutchKev wrote:
For some reason, the 'ion-nav-back-button' is always hidden.. And I can't figure out why??
It works correct when i do it manually with a ion-header..I have the following index.html:
<body ng-app='starter'> <ion-nav-bar class="bar-stable" align-title="left" no-tap-scroll="true"> <ion-nav-back-button class="button-clear"> <i class="icon ion-arrow-left-c"></i> </ion-nav-back-button> </ion-nav-bar> <ion-nav-view name="main"></ion-nav-view> </body>
And the following statesController:
$stateProvider .state('home', { url: '/', abstract: true, views: { main: { templateUrl: 'template/home.html', controller: 'homePageController' } } }) .state('messageList', { cache: false, url: '/messageList', views: { main: { templateUrl: 'template/messageList.html', controller: 'messageListController' } } });
And the messageList has this template:
<ion-view class="messageListWrapper" view-title="{{navTitle}}" hide-back-button="false"> <!-- <ion-nav-buttons side="primary"> <button class="button" ng-click="doSomething()"> I'm a button on the primary of the navbar! </button> </ion-nav-buttons> --> <ion-content id="messageListContainer"> <div ng-repeat="message in messages" class=" clearfix"> <div class="messageBubble chat-bubble {{message.position}}"> <span>{{message.message}}</span> </div> </div> </ion-content> <ion-footer-bar align-title="left" class="bar-assertive messageListFooter"> <div class="messageInputWrapper"> <i href="" class="icon ion-happy-outline"></i> <input type="text" placeholder="Send message..." id="sendMessageInput"/> </div> </ion-footer-bar> </ion-view>
But for some reason, when I go the MessageList page, the go-back button is never shown.. It always has the class 'hide'
Like this:<ion-nav-bar class="bar-stable nav-bar-container nav-bar-tabs-top" align-title="left" no-tap-scroll="true" nav-bar-transition="ios" nav-bar-direction="exit" nav-swipe=""> <ion-nav-back-button class="hide"></ion-nav-back-button> <div class="nav-bar-block" nav-bar="active"> <ion-header-bar class="bar-stable bar bar-header has-tabs-top" align-title="left" no-tap-scroll="true"> <button class="button back-button hide buttons button-clear header-item" ng-click="$ionicGoBack()" style="transition-duration: 0ms;"> <i class="ion-arrow-left-c"></i> <span class="back-text" style="transition-duration: 0ms; transform: translate3d(0px, 0px, 0px);"><span class="default-title hide">Back</span><span class="previous-title">Messages</span></span></button> <div class="title title-left header-item" style="transition-duration: 0ms; transform: translate3d(0px, 0px, 0px);"> <img class="title-image" src="img/user_male.png"> <h1 class="title">Kewin</h1></div> </ion-header-bar> </div> </ion-nav-bar>
As you can see, the back button always has the class 'hide'..
Any tips??
Posts: 1
Participants: 1