mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-22 21:48:42 +08:00
docs(demos): prettify config some more and add another page - fix back button icon
This commit is contained in:
@ -1,4 +1,4 @@
|
||||
import {App, Page, IonicApp, Platform} from 'ionic/ionic';
|
||||
import {App, Page, IonicApp, Platform, NavController} from 'ionic/ionic';
|
||||
|
||||
@App({
|
||||
templateUrl: 'app.html',
|
||||
@ -25,20 +25,22 @@ export class TabPage {
|
||||
templateUrl: 'main.html'
|
||||
})
|
||||
export class InitialPage {
|
||||
constructor(platform: Platform) {
|
||||
constructor(platform: Platform, nav: NavController) {
|
||||
this.platform = platform;
|
||||
this.nav = nav;
|
||||
|
||||
if (window.localStorage.getItem('configDemo') !== null) {
|
||||
this.config = JSON.parse(window.localStorage.getItem('configDemo'));
|
||||
}
|
||||
else if (platform.is('ios')) {
|
||||
this.config = {
|
||||
'backButtonIcon': 'ion-ios-arrow-back',
|
||||
'backButtonIcon': 'ios-arrow-back',
|
||||
'iconMode': 'ios',
|
||||
'tabbarPlacement': 'bottom'
|
||||
};
|
||||
} else {
|
||||
this.config = {
|
||||
'backButtonIcon': 'ion-md-arrow-back',
|
||||
'backButtonIcon': 'md-arrow-back',
|
||||
'iconMode': 'md',
|
||||
'tabbarPlacement': 'top'
|
||||
};
|
||||
@ -51,4 +53,22 @@ export class InitialPage {
|
||||
window.localStorage.setItem('configDemo', JSON.stringify(this.config));
|
||||
window.location.reload();
|
||||
}
|
||||
|
||||
push() {
|
||||
this.nav.push(AnotherPage);
|
||||
}
|
||||
}
|
||||
|
||||
@Page({
|
||||
templateUrl: 'page.html'
|
||||
})
|
||||
export class AnotherPage {
|
||||
constructor(nav: NavController) {
|
||||
this.nav = nav;
|
||||
|
||||
}
|
||||
|
||||
pop() {
|
||||
this.nav.pop();
|
||||
}
|
||||
}
|
||||
|
@ -7,8 +7,11 @@
|
||||
<ion-item>
|
||||
<ion-label>Back Button Icon</ion-label>
|
||||
<ion-select [(ngModel)]="config.backButtonIcon">
|
||||
<ion-option value="ion-ios-arrow-back">ion-ios-arrow-back</ion-option>
|
||||
<ion-option value="ion-md-arrow-back">ion-md-arrow-back</ion-option>
|
||||
<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>
|
||||
|
||||
@ -46,6 +49,12 @@
|
||||
}
|
||||
})</pre>
|
||||
|
||||
<div padding>
|
||||
<button block light (click)="push()">
|
||||
Go to Another Page
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</ion-content>
|
||||
|
||||
<style>
|
||||
|
9
demos/config/page.html
Normal file
9
demos/config/page.html
Normal file
@ -0,0 +1,9 @@
|
||||
<ion-navbar *navbar>
|
||||
<ion-title>Page</ion-title>
|
||||
</ion-navbar>
|
||||
|
||||
<ion-content>
|
||||
<div padding>
|
||||
<button block (click)="pop()">Go Back to Config</button>
|
||||
</div>
|
||||
</ion-content>
|
Reference in New Issue
Block a user