java - 搜索栏未在 Ionic 上显示

Question

我正在尝试在屏幕顶部制作一个固定的搜索栏(Android 的标签栏下方和 ios 的导航栏下方)。

我正在使用文档:http://ionicframework.com/docs/v2/api/components/searchbar/Searchbar/

ionic 版本:2.1.12

但是我的搜索栏没有显示。

我的代码:

HTML:

<ion-view title="Search" id="page3" hide-nav-bar="isAndroid">
    <div class="bar bar-subheader bar-positive item-input-inset" no-tap-scroll="true">
        <ion-searchbar
            [(ngModel)]="search"
            [showCancelButton]="shouldShowCancel"
            (ionInput)="handleSearch($event)">
        </ion-searchbar>
    </div>
    <ion-content has-header="true" padding="true">
        <ion-list>
            <ion-item ng-repeat="doc in documents" item="doc">
            </ion-item>
        </ion-list>
    </ion-content>
</ion-view>

屏幕截图:

如您所见，没有出现搜索栏...

我尝试将其放在 View 中的其他组件之间，但它也没有出现。该文档没有解释有关此主题的任何内容。非常令人沮丧

Answer 1

http://plnkr.co/edit/dPsGZjczRSNpqmMDqLZQ?p=info

这是您提供的代码，如果您删除所有 <br/>在 plunker 中添加标签，您会看到搜索栏被推到标题后面。

所以添加 style="z-index:999999999999" (只是为了确定)到 <ion-searchbar>结果是这个笨蛋:

http://plnkr.co/edit/JE1Vm47ehXsmkp5s9PGZ?p=info