mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 11:41:20 +08:00
Sink router
This commit is contained in:
@ -20,7 +20,56 @@ import {ModalPage} from './pages/modal'
|
||||
|
||||
|
||||
@App({
|
||||
templateUrl: 'main.html'
|
||||
templateUrl: 'main.html',
|
||||
routes: [
|
||||
{
|
||||
path: '/nav',
|
||||
component: NavPage,
|
||||
root: true
|
||||
}, {
|
||||
path: '/buttons',
|
||||
component: ButtonPage
|
||||
}, {
|
||||
path: '/lists',
|
||||
component: ListPage
|
||||
}, {
|
||||
path: '/list-groups',
|
||||
component: ListGroupPage
|
||||
}, {
|
||||
path: '/modal',
|
||||
component: ModalPage
|
||||
}, {
|
||||
path: '/ptr',
|
||||
component: PullToRefreshPage
|
||||
}, {
|
||||
path: '/cards',
|
||||
component: CardPage
|
||||
}, {
|
||||
path: '/forms',
|
||||
component: FormPage
|
||||
}, {
|
||||
path: '/segments',
|
||||
component: SegmentPage
|
||||
}, {
|
||||
path: '/table-search',
|
||||
component: TableSearchPage
|
||||
}, {
|
||||
path: '/icons',
|
||||
component: IconsPage
|
||||
}, {
|
||||
path: '/aside',
|
||||
component: AsidePage
|
||||
}, {
|
||||
path: '/animation',
|
||||
component: AnimationPage
|
||||
}, {
|
||||
path: '/slides',
|
||||
component: SlidePage
|
||||
}, {
|
||||
path: '/action-menu',
|
||||
component: ActionMenuPage
|
||||
}
|
||||
]
|
||||
})
|
||||
class MyApp {
|
||||
constructor(app: IonicApp) {
|
||||
@ -46,7 +95,7 @@ class MyApp {
|
||||
{ title: 'Action Menu', component: ActionMenuPage },
|
||||
];
|
||||
|
||||
this.rootView = ButtonPage
|
||||
//this.rootView = ButtonPage
|
||||
}
|
||||
|
||||
openPage(aside, component) {
|
||||
|
@ -9,7 +9,7 @@
|
||||
</ion-content>
|
||||
</ion-aside>
|
||||
|
||||
<ion-nav #content [root]="rootView" [register]="content" register-id="myNav"></ion-nav>
|
||||
<ion-nav #content [register]="content" register-id="myNav"></ion-nav>
|
||||
|
||||
<style>
|
||||
my-modal {
|
||||
|
@ -3,7 +3,7 @@ import {IonicView, NavController} from 'ionic/ionic';
|
||||
|
||||
@IonicView({
|
||||
template: `
|
||||
<ion-navbar *navbar><ion-title>Cards</ion-title></ion-navbar>
|
||||
<ion-navbar *navbar><ion-title>Navigation</ion-title></ion-navbar>
|
||||
|
||||
<ion-content class="padding">
|
||||
<h2>Navigation</h2>
|
||||
|
@ -33,6 +33,34 @@ class TopTabPage {
|
||||
}
|
||||
}
|
||||
|
||||
@IonicView({
|
||||
template: '' +
|
||||
'<ion-navbar *navbar>' +
|
||||
'<ion-title>Search</ion-title>' +
|
||||
'</ion-navbar>' +
|
||||
'<ion-content class="padding">' +
|
||||
'</ion-content>'
|
||||
})
|
||||
class SearchTabPage {
|
||||
constructor(nav: NavController) {
|
||||
this.nav = nav;
|
||||
}
|
||||
}
|
||||
|
||||
@IonicView({
|
||||
template: '' +
|
||||
'<ion-navbar *navbar>' +
|
||||
'<ion-title>Updates</ion-title>' +
|
||||
'</ion-navbar>' +
|
||||
'<ion-content class="padding">' +
|
||||
'</ion-content>'
|
||||
})
|
||||
class UpdatesTabPage {
|
||||
constructor(nav: NavController) {
|
||||
this.nav = nav;
|
||||
}
|
||||
}
|
||||
|
||||
@IonicView({
|
||||
template: `
|
||||
<ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Tabs</ion-title></ion-navbar>
|
||||
@ -40,12 +68,8 @@ class TopTabPage {
|
||||
<ion-tabs id="tabs">
|
||||
<ion-tab tab-title="Featured" tab-icon="ion-ios-star" [root]="featuredTab"></ion-tab>
|
||||
<ion-tab tab-title="Top Charts" tab-icon="ion-ios-list-outline" [root]="topTab"></ion-tab>
|
||||
<ion-tab tab-title="Search" tab-icon="ion-ios-search">
|
||||
<ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Search</ion-title></ion-navbar>
|
||||
</ion-tab>
|
||||
<ion-tab tab-title="Updates" tab-icon="ion-ios-download-outline">
|
||||
<ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Updates</ion-title></ion-navbar>
|
||||
</ion-tab>
|
||||
<ion-tab tab-title="Search" tab-icon="ion-ios-search" [root]="searchTab"></ion-tab>
|
||||
<ion-tab tab-title="Updates" tab-icon="ion-ios-download-outline" [root]="updatesTab"></ion-tab>
|
||||
</ion-tabs>
|
||||
`
|
||||
})
|
||||
@ -54,5 +78,7 @@ export class TabsPage extends SinkPage {
|
||||
super(app);
|
||||
this.featuredTab = FeaturedTabPage;
|
||||
this.topTab = TopTabPage;
|
||||
this.searchTab = SearchTabPage;
|
||||
this.updatesTab = UpdatesTabPage;
|
||||
}
|
||||
}
|
||||
|
@ -34,7 +34,7 @@ export class IonicRouter {
|
||||
}
|
||||
|
||||
stateChange(type, activeView) {
|
||||
// this fires when the app's state has changed stateChange will
|
||||
// this fires when the app's state has changed. `stateChange` will
|
||||
// tell each of the state managers that the state has changed, and
|
||||
// each state manager will decide what to do with this info
|
||||
// (the url state manager updates the url bar if a route was setup)
|
||||
|
Reference in New Issue
Block a user