在ios（iPhone）平台上，popover中的Ionic标头未正确显示

我有以下自定义弹出窗口模板：

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



  <ion-header-bar class="bar bar-header">
    <h1 class="title">Available sounds</h1>
  </ion-header-bar>

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

    <ion-tab title="{{ 'SOUNDS' | translate }}">

      <ion-content class="has-header">
        <div class="item item-button-right" ng-repeat="sound in availableSounds">
          {{sound.name}}
          <button class="button button-positive" ng-click="addSoundToSelection({{$index}})">
            <i class="icon ion-plus-circled"></i>
          </button>
        </div>

        </div>


      </ion-content>

    </ion-tab>

    <ion-tab title="{{ 'PRE-PREPARED_MIX' | translate }}">

      <ion-content class="has-header">
        <div class="item item-button-right" ng-repeat="sound in availablePrepreparedSounds">
          {{sound.name}}
          <button class="button button-positive" ng-click="addSoundToSelection({{$index}})">
            <i class="icon ion-plus-circled"></i>
          </button>
        </div>
      </ion-content>

    </ion-tab>
  </ion-tabs>

</ion-popover-view>

它在浏览器和Android上产生了成功的结果，但在iOS emulator上结果受损，请参见下图

我怎样才能解决它呢

---

非常感谢您的建议。

为了适应iOS 7+中的透明状态栏，爱奥尼亚的CSS将标题栏向下推20像素。似乎爱奥尼亚团队忘记了头条也存在于弹出框中。我想在此期间，您可以使用类似于下面样式的内容覆盖弹出窗口标题栏的样式

.platform-ios.platform-cordova:not(.fullscreen) .popover .bar-header > * {
  margin-top: 0;
}

.platform-ios.platform-cordova:not(.fullscreen) .popover .bar-header {
  height: 44px;
}

.platform-ios.platform-cordova:not(.fullscreen) .popover .has-header {
  top: 44px;
}