Ionic framework, how to make input not scrollable with list in popover?

I have following code in popover template:

<ion-popover-view class="customPopup">


  <ion-header-bar class="bar bar-header barHeaderCustom">
    <h1 class="title">{{ 'AVAILABLE_SOUNDS' | translate }}</h1>
  </ion-header-bar>

  <ion-tabs class="tabs-icon-only tabs-top tabs-positive">

    <ion-tab title="{{ 'SOUNDS' | translate }}">
      <ion-content class="has-header">
        <!-- SEARCH INPUT-->
        <label class="item item-input">
          <i class="icon ion-search placeholder-icon"></i>
          <input type="text" placeholder="{{ 'SEARCH' | translate }}" ng-model="searchedStringSingleSounds">
        </label>
        <!-- //SEARCH INPUT-->
        <div ng-click="addSoundToSelection({{$index}},'singles')" class="item item-button-right" ng-repeat="sound in availableSounds| filter:searchedStringSingleSounds">
          {{sound.name}}
          <button class="button button-positive" >
            <i class="icon ion-plus-circled"></i>
          </button>
        </div>
        </div>
      </ion-content>
    </ion-tab>

Which is producing following popover window:

enter image description here

Problem is that input is scrolling with listView content, but should be static. How can i do it please?

I tried to found solution in documentation, but without luck.

Many thanks for any advice.

Move your input outside your ion-content and place it in a subheader

<ion-header-bar class="bar bar-header barHeaderCustom">
  <h1 class="title">{{ 'AVAILABLE_SOUNDS' | translate }}</h1>
</ion-header-bar>

<div class="bar bar-subheader item-input-inset">
 <label class="item-input-wrapper">
   <i class="icon ion-search placeholder-icon"></i>
   <input type="text" placeholder="{{ 'SEARCH' | translate }}" ng-model="searchedStringSingleSounds">
 </label>
</div>

then add has-header has-subheader classes to your ion-content element

<ion-content class="has-header has-subheader">