Html 在ionic框架中，将搜索输入保持在列表视图的顶部

我是离子框架的新手，所以我现在正在试验它。在我的一个页面上，我有一个搜索输入，后面是一个列表，如下所示：

当我向上滚动时，搜索字段与列表视图一起向上滚动。滚动时是否可以将搜索字段固定在顶部

这是迄今为止我的HTML标记：

<ion-view view-title="Force">
  <ion-content>
    <label class="item item-input">
      <i class="icon ion-search placeholder-icon"></i>
      <input type="text" placeholder="Search Force" data-ng-model="searchForce">
    </label>
    <div class="list">
      <ion-item class="item-icon-right" ng-repeat="force in forces | filter:searchForce" type="item-text-wrap" href="#/tab/force/{{force.id}}">
        {{force.name}}
        <i class="icon ion-chevron-right icon-accessory"></i>
      </ion-item>
    </div>
  </ion-content>
</ion-view>

{{force.name}

您可以为此使用子标题：

 <ion-header-bar class="bar-light bar-subheader">
      <input type="text" placeholder="Search Force" data-ng-model="searchForce">
      <button ng-if="searchForce.length"
              class="button button-icon ion-android-close input-button"
              ng-click="clearSearch()">
      </button>
</ion-header-bar>

另请参阅本帖，了解一些备选方案：