How to mix tab button bar with left menu button in header


#1

how would I add something like a scope bar from ios to my header. The ionic equivalent seems to be the button bar but it seems to overlay on top of the left nav button as well. How can I make them all fit?

I want something like this in the header
https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/Art/scope_bar_2x.png

  <ion-nav-buttons side="left">
    <button menu-toggle="left" class="button button-icon icon ion-navicon"></button><div notification-badge ></div>
  </ion-nav-buttons>

    <div class="button-bar" >
    <a class="button" >Upcoming</a>
    <a class="button" >Past</a>
    </div>