ionic：ヘッダーバーにカスタム要素を追加する方法、またはビューごとに独自のヘッダーバーを追加する方法はありますか？

Question

私はIonicを初めて使い慣れました。ヘッダーバーにカスタムアイテムを追加したいと思います。

イオンバーの要素の内側にフレームバーによってヘッダーバーが生成されているようです。

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

タブテンプレートのビュータイトルは自動的にヘッダーバーに挿入されます。ここで

<ion-view view-title="Home"> 

は、私が働いているコードです：https://plnkr.co/edit/39XMp3FylDHofwJcFZmr?p=preview これは、イオンのドキュメントから取得されます：http://ionicframework.com/docs/api/directive/ionTabs/

ヘッダーバーのドキュメントでは、イオンコンテンツ要素の前にヘッダーバーの要素を追加する、と言います（ホームテンプレートを参照）、表示されません。

<ion-view view-title="Home"> 
    <ion-header-bar align-title="left" class="bar-positive"> 
    <h1 class="title">Custom Header</h1> 
    </ion-header-bar> 
    <ion-content class="padding"> 
    <p> 
     <a class="button icon icon-right ion-chevron-right" href="#/tab/facts">Scientific Facts</a> 
    </p> 
    </ion-content> 
</ion-view> 

どのように私は、現在表示しているタブに応じて、ヘッダーバーに自分の要素を追加したり、各テンプレートでヘッダーバーを持つことができますか？

Answer 1

は、より多くの検索後、私はこれを見つけた：http://codepen.io/calendee/pen/hIkoJ

私は私のテンプレートにイオンナビゲーションバーを追加する必要がありますようですが、見えます：

<ion-view view-title="Home"> 
    <ion-nav-bar class="bar-positive" align-title="center"> 
    <ion-nav-back-button class="button-icon ion-arrow-left-c"> 
    </ion-nav-back-button> 
    <ion-nav-buttons side="right"> 
     <button class="button" ng-click="baz()"> 
     RightButton! 
     </button> 
    </ion-nav-buttons> 

    </ion-nav-bar> 
    <ion-content class="padding"> 
    <p>{{lol}} 

更新plnkr：https://plnkr.co/edit/33YSRvp2H92dbeliEaj6?p=preview