如何将离子含量放在离子导航条上？

Question

我正在尝试在我的应用中实现一个弹出窗口。这是我的html的基本结构：

<ion-header>
    <ion-navbar>
        <ion-title>{{title}}</ion-title>
    </ion-navbar>
</ion-header>

<ion-content padding>
    <...>
</ion-content>

<ion-content class = "popup" [hidden] = "isPopupHidden" >
    <...>
</ion-content>

所以你看，我有一个带有导航栏的标题，一个用于默认页面内容的离子内容，当isPopupHidden为false时，最后一个离子内容是我想要的东西。问题是我的弹出部分总是在离子导航栏下面。 （注意：测试表明它显示在ion-header之上）。所以我需要它重叠一切，包括ion-navbar。我试过搞乱z-index，但这没有帮助。有什么想法吗？

编辑：这是我的问题的图像。请注意导航栏如何位于弹出窗口之上：