I am fairly new to Ionic 2, so please excuse me if this a question with an obvious answer. I am trying to build an application with a global navbar component. I attempted creating a navbar component by following this post: http://stackoverflow.com/questions/35936198/ionic-2-global-navbar-for-the-app. After running my application in the browser, I still cannot see the navbar component. When I inspect the html, I see something like:
<navbar> <!--template bindings={}--> </navbar>
It looks like the component is being bound correctly, but the actual data within the component is not being served. My question is: is it possible for me to create a global navbar in such a way? Or do I need to replicate the navbar HTML on every page of my application?
I commented on the stackoverflow, but that is not the correct answer.
There is no way to create a global ion-navbar, as this is done on purpose. The point of having a navbar defined for each component is so that we can properly animate the titles, navbar background color (if you change them) and animate other properties needed.
Thanks for the reply - that makes sense.
@mhartington I understand why you can’t have a global navbar, so I am replicating the same navbar html across all my pages that share the navbar. Do I then also have to replicate the corresponding typescript functions that define which page to navigate to when a button on my navbar is selected? Or is the convention to create and call a service that does this?
I would definitely not use a service to do anything involving navigation.
@rapropos thanks for the input. What would you say is the best way to reduce code duplication in such a case? I’m dealing with quite a large project, so it would be helpful to have navigation in some centrally-defined way.
I would try wrapping it in a custom component along the lines of @brandyscarney’s comment near the end of this discussion.
This is along the lines of what I was thinking when I initially started this discussion - I was wondering if it was okay to create a custom component for the navbar and use a directive to reference it. However, @mhartington brought up how doing this is not correct, as inhibits the ability to properly animate titles.
I guess we just have to have an Ionic team member deathmatch.
Indeed 
- thanks for taking a stab at it. Would appreciate a comment on this from @mhartington when he gets a chance.