Navbar

`ion-navbar`

Navbar acts as the navigational toolbar, which also comes with a back button. A navbar can contain a ion-title, any number of buttons, a segment, or a searchbar. Navbars must be placed within an <ion-header> in order for them to be placed above the content. It's important to note that navbar's are part of the dynamic navigation stack. If you need a static toolbar, use ion-toolbar.

Usage

<ion-header>

  <ion-navbar>
    <button ion-button icon-only menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>

    <ion-title>
      Page Title
    </ion-title>

    <ion-buttons end>
      <button ion-button icon-only (click)="openModal()">
        <ion-icon name="options"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>

</ion-header>

Instance Members

`navCtrl`

`backButtonClick()`

`setBackButtonText()`

Set the text of the Back Button in the Nav Bar. Defaults to “Back”.

Input Properties

Attr	Type	Details
color	`string`	The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
mode	`string`	The mode to apply to this component.
hideBackButton	`boolean`	whether the back button should be shown or not

Toolbar API Docs