Files
Brandy Carney 41064bf2be refactor(tabs): rename tab input/config options to be more clear/consistent
BREAKING CHANGES:

Tab input/config options have been renamed. The following options were
renamed:

- `tabbarHighlight` -> `tabsHighlight`
- `tabbarLayout` -> `tabsLayout`
- `tabSubPages` -> `tabsHideOnSubPages`
- `tabbarPlacement` -> `tabsPlacement`

The previous names have been deprecated. They will still work in the
current release but will be removed in the future so please update to
the new names.

references #7143
2016-07-07 13:09:00 -04:00

78 lines
1.9 KiB
HTML

<ion-header>
<ion-navbar>
<ion-title>Config</ion-title>
</ion-navbar>
</ion-header>
<ion-content class="config-demo">
<ion-list>
<ion-item>
<ion-label>Back Button Icon</ion-label>
<ion-select [(ngModel)]="config.backButtonIcon">
<ion-option value="ios-arrow-back">ios-arrow-back</ion-option>
<ion-option value="md-arrow-back">md-arrow-back</ion-option>
<ion-option value="close">close</ion-option>
<ion-option value="heart">heart</ion-option>
<ion-option value="globe">globe</ion-option>
</ion-select>
</ion-item>
<ion-item>
<ion-label>Icon Mode</ion-label>
<ion-select [(ngModel)]="config.iconMode">
<ion-option value="ios">ios</ion-option>
<ion-option value="md">md</ion-option>
</ion-select>
</ion-item>
<ion-item>
<ion-label>Tab Placement</ion-label>
<ion-select [(ngModel)]="config.tabsPlacement">
<ion-option value="bottom">bottom</ion-option>
<ion-option value="top">top</ion-option>
</ion-select>
</ion-item>
</ion-list>
<p class="note">Note: the config will not be updated until you click the button below.</p>
<div padding>
<button block (click)="load()">
Update Config
</button>
</div>
<p class="note">Any config for your app should be passed as the third argument to ionicBootstrap.</p>
<!-- this has to be formatted weird for pre -->
<pre margin>
ionicBootstrap(MyApp, [], {
backButtonIcon: "{{initialConfig.backButtonIcon}}"
iconMode: "{{initialConfig.iconMode}}"
tabsPlacement: "{{initialConfig.tabsPlacement}}"
});</pre>
<div padding>
<button block secondary (click)="push()">
Go to Another Page
</button>
</div>
</ion-content>
<style>
.config-demo pre {
background-color: #f8f8f8;
}
.config-demo .note {
color: #444;
font-style: italic;
margin: 0 16px;
}
</style>