Adding ion-nav-buttons in side menu page with tabs


#1

I am facing issue in adding a button to the right side of Nav Bar in one of the page from Side Menu. The page(page.html) has 4 Tabs. I need the right side button in only this page, all other pages to have only side menu icon in nav-bar. Codes as below:

menu.html

       <ion-side-menu-content>
            <ion-nav-bar class="bar-stable">
                <ion-nav-back-button>
                </ion-nav-back-button>
                <ion-nav-buttons side="primary">
                    <button class="button button-icon button-clear ion-navicon" menu-toggle="left"> 
                    </button>           
                </ion-nav-buttons>
            </ion-nav-bar>
            <ion-nav-view name="menuContent">
            </ion-nav-view>
        </ion-side-menu-content>

page.html

<ion-view>
       <ion-nav-buttons side="secondary">
                <button class="button">OptIn</button>           
       </ion-nav-buttons> 
       
      <ion-tabs class="tabs-striped tabs-top tabs-color-active-positive">

        <ion-tab title="Tab1" ui-sref="app.tabs.tab1">
        <ion-nav-view name="tab-1"></ion-nav-view>
        </ion-tab>
      
        <ion-tab title="Tab2" ui-sref="app.tabs.tab2">
        <ion-nav-view name="tab-2"></ion-nav-view>
        </ion-tab>

        <ion-tab title="Tab3" ui-sref="app.tabs.tab3">
        <ion-nav-view name="tab-3"></ion-nav-view>
      </ion-tab>

        <ion-tab title="Tab4" ui-sref="app.tabs.tab4">
        <ion-nav-view name="tab-4"></ion-nav-view>
      </ion-tab>

    </ion-tabs>
    </ion-view>