Override side menu header with search box bar

I am using a side menu for navigation. In some pages I want to add a search box. The problem is that I have to put the search box inside “ion-nav-buttons” tag to make it viewable which apparently breaks ng-model binding of that search box:

    <ion-nav-buttons side="right" >

        <div class="item-input-inset"  ng-show="showSearch" style="left: 30px;">
            <label class="item-input-wrapper">
                <i class="icon ion-ios-search placeholder-icon"></i>
                <input type="search" placeholder="Search" ng-model="customerName">
            <button class="button button-clear" ng-click="toggleShowSearch();">

        <button class="button button-icon button-clear ion-android-search " ng-click="toggleShowSearch()" ng-show="!showSearch" ></button>
        <button class=" button button-icon button-clear ion-android-add " ng-show="!showSearch" ng-click="editCustomer(0)"></button>
        <!--i class=" button button-icon button-clear ion-android-more-vertical" ng-show="!showSearch"></i-->
    <ion-content class="has-header">
        <div class="list">
            <div ng-repeat="customer in customers | filter: customerName">



Any ideas?!