javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 11:41:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(nav): NavPush and NavPop

Browse Source
This commit is contained in:
Max Lynch
2015-06-10 14:06:59 -05:00
parent 31dfe1f8c6
commit 1403819099
4 changed files with 58 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
ionic/components.js
View File

@ -17,6 +17,7 @@ export * from 'ionic/components/modal/modal'
export * from 'ionic/components/nav/nav'
export * from 'ionic/components/nav/nav-controller'
export * from 'ionic/components/nav/nav-params'
export * from 'ionic/components/nav/nav-push'
export * from 'ionic/components/nav-bar/nav-bar'
export * from 'ionic/components/slides/slides'
export * from 'ionic/components/radio/radio'

44
ionic/components/nav/nav-push.js Normal file
View File

@ -0,0 +1,44 @@
import {Directive, onInit} from 'angular2/src/core/annotations_impl/annotations';
import {Optional} from 'angular2/src/di/annotations_impl';
import {Compiler} from 'angular2/angular2';
import {ElementRef} from 'angular2/src/core/compiler/element_ref';
import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_component_loader';
import {Injector} from 'angular2/di';
import {ViewController} from '../view/view-controller';
import {NavController} from './nav-controller';
@Directive({
selector: '[nav-push]',
hostListeners: {
'^click': 'onClick($event)'
},
properties: [
'navPush: nav-push',
'pushData: push-data'
]
})
export class NavPush {
constructor(nav: NavController) {
this.nav = nav;
}
onClick(event) {
this.nav.push(this.navPush, this.pushData);
}
}
@Directive({
selector: '[nav-pop]',
hostListeners: {
'^click': 'onClick($event)'
}
})
export class NavPop {
constructor(nav: NavController) {
this.nav = nav;
}
onClick(event) {
this.nav.pop();
}
}

10
ionic/components/nav/test/basic/pages/first-page.js
View File

@ -1,7 +1,7 @@
import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
import {View} from 'angular2/src/core/annotations_impl/view';
import {NavController, NavbarTemplate, Navbar, Content} from 'ionic/ionic';
import {NavController, NavbarTemplate, Navbar, NavPush, Content} from 'ionic/ionic';
import {SecondPage} from './second-page';
@ -21,10 +21,11 @@ import {SecondPage} from './second-page';
'<ion-content class="padding">' +
'<p>First Page: {{ val }}</p>' +
'<p><button class="button" (click)="push()">Push (Go to 2nd)</button></p>' +
'<p><button class="button" [push-data]="pushData" [nav-push]="pushPage">Push w/ nav-push (Go to 2nd)</button></p>' +
'<f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>' +
'<f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>' +
'</ion-content>',
directives: [NavbarTemplate, Navbar, Content]
directives: [NavbarTemplate, Navbar, NavPush, Content]
})
export class FirstPage {
constructor(
@ -32,6 +33,11 @@ export class FirstPage {
) {
this.nav = nav;
this.val = Math.round(Math.random() * 8999) + 1000;
this.pushPage = SecondPage;
this.pushData = {
id: 420
}
}
viewLoaded() {

7
ionic/components/nav/test/basic/pages/second-page.js
View File

@ -1,7 +1,7 @@
import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
import {View} from 'angular2/src/core/annotations_impl/view';
import {NavController, NavParams, NavbarTemplate, Navbar, Content} from 'ionic/ionic';
import {NavController, NavPop, NavParams, NavbarTemplate, Navbar, Content} from 'ionic/ionic';
import {ThirdPage} from './third-page';
@ -13,13 +13,16 @@ import {ThirdPage} from './third-page';
<p>
<button class="button" (click)="pop()">Pop (Go back to 1st)</button>
</p>
<p>
<button class="button" nav-pop>Pop with NavPop (Go back to 1st)</button>
</p>
<p>
<button class="button" (click)="push()">Push (Go to 3rd)</button>
</p>
<div class="green"><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f></div>
</ion-content>
`,
directives: [NavbarTemplate, Navbar, Content]
directives: [NavbarTemplate, NavPop, Navbar, Content]
})
export class SecondPage {
constructor(