I am building an app with a global nav-bar.
I have some buttons that I would like to always appear on the nav-bar and so I’ve defined them outside of the ion-nav-view. I have other buttons which are specific to a certain view, so they are defined within the template that gets loaded into the ion-nav-view.
In some cases, I want to remove a “global” button as we enter a specific view, where a view specific button is added (so as not to clutter the nav-bar). In this case, the nav-bar title width is often being calculated wrong (too small) and the “global” buttons appear and disappear late and often “fall off” the nav-bar, appearing below. However, all this only happens in the ripple emulator or in the iOS simulator, running the same code in a plain web browser works perfectly.
To illustrate, I’ve created a code pen: http://codepen.io/hds/pen/qEOqdY
The code pen works perfectly in the web browser, but if you create an app from it and run it in a simulator, the problems with the buttons appears.
I’m not even sure if what I’m doing is supported, but since it works fine in browser, it would be great if I could get this working on devices as well.
Thanks in advance for any help, ideas, or pointers!