angulaire.js - modèle d'onglets ioniques comment afficher le champ de recherche dans l'en-tête

Question

Nouveau chez ionic, j'utilise le modèle d'onglets inoïques.
Lors de la création d'une interface de recherche, je souhaite afficher le champ de recherche dans l'en-tête

J'ai défini l'attribut hide-nav-bar="false" dans la <ion-view> de l'interface de recherche,
et j'ai ajouté <ion-nav-bar>
Il y a deux problèmes avec cette opération. L'un est que <ion-content> est en haut et couvert par la nouvelle <ion-nav-bar>
L'autre problème est que lorsqu'il est juste. rafraîchi, la <ion-nav-bar> d'origine est affichée, puis masquée, puis la nouvelle <ion-nav-bar>

Je souhaite afficher le champ de recherche dans l'en-tête. Quelle est la bonne façon de procéder ?

La description n'est peut-être pas claire, alors désolé.

---

Ajout d'une question,
page d'index

    <ion-nav-bar class="bar-assertive">
        <ion-nav-back-button>
        </ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view></ion-nav-view>

Comment remplacer <ion-nav-bar>

sur d'autres pages

Answer 1

<ion-view>

<ion-nav-title>
    <ion-header-bar class="item-input-inset">
        <label class="item-input-wrapper">
            <i class="icon ion-ios-search placeholder-icon"></i>
            <input type="search" placeholder="Search" ng-model="searchContent">
        </label>
        <button class="button button-clear">
            取消
        </button>
    </ion-header-bar>
</ion-nav-title>
<ion-content>
    <ion-list>
        <ion-item class="item-pider">
            搜索历史
        </ion-item>
        <ion-item>
            xxx
        </ion-item>
        <ion-item>
            xxx
        </ion-item>
    </ion-list>
</ion-content>

</ion-view>