hi and sorry is this quesiton is answered somewhere else.
there is many questions avout hiding the back button. What is instead i want to keep the same header throughout the app (to simplify)
Thanks for your help
1 Like
So you want the same header on each view but no back button ever?
Just declare the ion-nav-bar without the ion-nav-back-button
<ion-nav-bar class="bar-positive">
</ion-nav-bar>
Not sure if this is what you mean.
thanks @brandyshea - nice dog by the way ;),
well to be honest I want to keep the same header (including nav icon on left and right). Basically If you look at the image below, I d like to switch between the âDishâ view and the ârestaurantâ view and keeping the same header (for other flow in the app, I will keep the back button)
but when I click on "restaurant, I have this header (whereas I 'd like to keep the header as picture above)
I had tried declaring ion-nav-bar , while it withdraws the back button, I still do not have the navigation left and right icons that i need.
PS/FYI : I have tried to use ion-tabs but is to too heavy for what I need + customisation is too limited.
Haha thanks. 
Can you share your code for this or put it in a codepen? Seeing the structure of the app makes it easier to help. 
If they are separate views, you can hide the back button on the view itself, but again I donât know how your app is structured.
<ion-view hide-back-button="true">
7 Likes
hehe
yes i have tried, hides the button but doesnât show the left and right nav icons. I have tried to put a plunker, spent some time to try to make it work properly but ⌠I was not lucky. http://plnkr.co/edit/pRzOVvpApvGSwXUZsBGa?p=preview neverless the less, the code is there!
Hi @celiostat
I downloaded the âprojectâ directly from Plunker, created a new local project on my machine making adjustments and tried to run . . .but failed (must have some details Iâm not noticing)
Anyway, I noticed some details and would like to make some suggestions.
in your app.js file you are calling the modules:
angular.module ('wmapp' ['ionic', 'wmapp.controllers', 'wmapp.factory_dishes', 'pasvaz.bindonce'])
but realize that you are calling the controller in the plural, and their âphysicalâ file is: controller.js . . . correct me if Iâm wrong, but so angularjs will not see the correct file, right?
the wm_main.html file it will be called inside the â </ ion-nav-view>â of index.html file, so the doctype is unnecessary?
And finally, on the heaveness of using the âion-tabsâ, you have a quite big and with a large volume of data array. change the ng-repeat the collection, the latter is for large volumes of data
I hope I helped.
thanks @drr_
hum I suggest if you want to have a look that you go straight to https://github.com/celiostat/Whichmeal_Ionic where you can find the whole project.
Regarding your comments :
1/ controllerS.js : that is a mistake on plunker, locally it is indeed spelled with an âSâ. thanks for pointing it out,
2/ indeed doctype is unnecessary, but as this was flagged as a warning by Plunker, iâve tried to see if that would change, locally doctype is only included index.html
3/ Funny enough I have tried to changed ng-repeat to collection-repeat, but i have to used fixed height, which causes ⌠problems in my app design + installing the nightly build fixed all scrolling issues.
However navigating within the app is quite slow due to large amount of data to process/fetch, probably something linked to my JS which must be quite poor (i am a very very beginner) . If somehow you would have an idea on how to fix this, I would be super grateful
Hey @celiostat
I downloaded the file from git and i made it! honestly was easy, lol!
In the wm_main.html, everything inside the of directive:
<ion-nav-bar>
just delete
Inside the dishList.hmtl between ion-view directive open e closes just copy and past the nav-buttons for the left and right menus 
repeat this inside of restList.html and be happy 
final considerations: 2 tips
- do a little review in the code, it may help to leave the app with less delay
- you already have a well established website, why not capture the data directly from the database used by the site and use it within the app?
This VĂdeo for example, teaches you how to get data in jsonp, and the final âproductâ which is a blog posts player is super fast. He pulls of a public site, thousands of information ⌠and it is fast!
think this idea
[Edit] and on the web has other tutorials on how to do this capture using angularjs and django - photos app running and proving that it worked:
I hope this solves the problem, but if you need anything else just send a msg
thanks @drr_
I think we are almost there. But though display looks fine, I have a couple of issues :
** Links between tabs seem to work, but somehow, when going bak and forth between dish and restaurant tabs, at some point it breaks, and I canât navigate anymore. (edited: As I am doing some work on restList.html to display map, seems error is coming from here)
** when I enter a specific dish view, back button disappeared, and sometimes, busing back button of the browser (chrome) page, brings me back to restaurant tab, instead of dish tab âŚ
answering your other questions :
1/ yes definitely, I juts need to be more knowledgeable in JS 
2/ thanks for the video. Indeed. I am right know developing the API for pulling and pusshing data from our DB⌠However, this will surely come another option given to user, as the project as it is now allows an full 100% offline usage
3/yep
dishList.html :
<ion-view >
<ion-nav-buttons side="left">
<button class="button button-icon button-clear ion-navicon" menu-toggle="left">
</button>
</ion-nav-buttons>
<ion-nav-title>
<img class="navigation_bar_logo"src="img/WM_name_transparent_color.png">
</ion-nav-title>
<ion-nav-buttons side="right">
<button class="button button-icon button-clear ion-compass " menu-toggle="right">
</button>
</ion-nav-buttons>
restList.html:
<ion-view>
<ion-nav-buttons side="left">
<button class="button button-icon button-clear ion-navicon" menu-toggle="left">
</button>
</ion-nav-buttons>
<ion-nav-title>
<img class="navigation_bar_logo"src="img/WM_name_transparent_color.png">
</ion-nav-title>
<ion-nav-buttons side="right">
<button class="button button-icon button-clear ion-compass " menu-toggle="right">
</button>
</ion-nav-buttons>
dish.html :
<ion-view >
<ion-nav-back-button>
</ion-nav-back-button>@brandyshea This is great, I think most people will be looking to disable the back button for a given view within a tabbed app, and after hours of trawling the web and documentation, youâre the only person whoâs said it. Thank you!
1 Like
Hey, sorry it was so difficult to find! Itâs a bit hidden at the bottom of the ion-view section in the docs (under API): http://ionicframework.com/docs/api/directive/ionView/
Please send me a message if you have any suggestions of how we could improve this.
1 Like
Haha well shucks. Totally missed that, my bad! Thanks for all the great stuff you guys are doing!
1 Like
For Ionic 2 <ion-navbar> i use the css below:
.back-button.show-back-button {
display: none;
}
2 Likes