mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 19:57:22 +08:00
so far so good nav stuff
This commit is contained in:
@ -13,6 +13,7 @@ export * from 'ionic/components/form/label/label'
|
||||
// export * from 'ionic/components/layout/layout'
|
||||
export * from 'ionic/components/list/list'
|
||||
export * from 'ionic/components/nav/nav'
|
||||
export * from 'ionic/components/nav/nav-controller'
|
||||
export * from 'ionic/components/nav/nav-item'
|
||||
// export * from 'ionic/components/nav/decorators'
|
||||
export * from 'ionic/components/radio/radio'
|
||||
|
@ -1,6 +1,7 @@
|
||||
import * as util from 'ionic/util';
|
||||
import {Transition, ClickBlock} from 'ionic/ionic';
|
||||
import {NavItem} from './nav-item'
|
||||
import {NavItem} from './nav-item';
|
||||
import {NavController} from './nav-controller';
|
||||
|
||||
|
||||
const STAGED_STATE = 'staged';
|
||||
@ -16,6 +17,7 @@ export class NavBase {
|
||||
|
||||
constructor() {
|
||||
this.items = [];
|
||||
this.navCtrl = new NavController(this);
|
||||
}
|
||||
|
||||
set initial(Class) {
|
||||
|
@ -1,13 +1,15 @@
|
||||
|
||||
export class NavController {
|
||||
constructor() {
|
||||
|
||||
constructor(nav) {
|
||||
this._nav = nav;
|
||||
}
|
||||
|
||||
push() {
|
||||
return this.nav.push.apply(this.nav, arguments);
|
||||
return this._nav.push.apply(this._nav, arguments);
|
||||
}
|
||||
|
||||
pop() {
|
||||
return this.nav.pop.apply(this.nav, arguments);
|
||||
return this._nav.pop.apply(this._nav, arguments);
|
||||
}
|
||||
}
|
||||
|
@ -1,6 +1,8 @@
|
||||
import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
|
||||
import {bind} from 'angular2/di';
|
||||
|
||||
import * as util from 'ionic/util';
|
||||
import {NavController} from './nav-controller';
|
||||
|
||||
|
||||
export class NavItem {
|
||||
@ -16,14 +18,16 @@ export class NavItem {
|
||||
let resolve;
|
||||
let promise = new Promise((res) => { resolve = res; });
|
||||
|
||||
let injector = null;
|
||||
|
||||
let injector = this.nav.injector.resolveAndCreateChild([
|
||||
bind(NavController).toValue(this.nav.navCtrl)
|
||||
]);
|
||||
|
||||
this.nav.loader.loadNextToExistingLocation(this.Class, this.nav.itemContent.elementRef, injector)
|
||||
.then((componentRef) => {
|
||||
|
||||
this.component = componentRef;
|
||||
this.domElement = componentRef.location.domElement;
|
||||
this.domElement.classList.add('nav-item');
|
||||
|
||||
resolve();
|
||||
});
|
||||
|
@ -3,6 +3,7 @@ import {Component, Directive} from 'angular2/src/core/annotations_impl/annotatio
|
||||
import {View} from 'angular2/src/core/annotations_impl/view';
|
||||
import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_component_loader';
|
||||
import {ElementRef} from 'angular2/src/core/compiler/element_ref';
|
||||
import {Injector} from 'angular2/di';
|
||||
|
||||
import {NavBase} from 'ionic/components/nav/nav-base';
|
||||
import {NavItem, NavItemDynamicComponent} from 'ionic/components/nav/nav-item';
|
||||
@ -33,12 +34,14 @@ export class Nav extends NavBase {
|
||||
|
||||
constructor(
|
||||
loader: DynamicComponentLoader,
|
||||
elementRef: ElementRef
|
||||
elementRef: ElementRef,
|
||||
injector: Injector
|
||||
) {
|
||||
super();
|
||||
this.loader = loader;
|
||||
this.viewManager = loader._viewManager;
|
||||
this.elementRef = elementRef;
|
||||
this.injector = injector;
|
||||
}
|
||||
|
||||
}
|
||||
|
@ -5,15 +5,15 @@ import {NavController} from 'ionic/ionic'
|
||||
import {SecondPage} from './second-page'
|
||||
|
||||
|
||||
@Component()
|
||||
@Component({selector: 'ion-view'})
|
||||
@View({
|
||||
templateUrl: 'pages/first-page.html'
|
||||
})
|
||||
export class FirstPage {
|
||||
constructor(
|
||||
//nav: NavController
|
||||
nav: NavController
|
||||
) {
|
||||
//this.nav = nav;
|
||||
this.nav = nav;
|
||||
}
|
||||
|
||||
push() {
|
||||
|
@ -28,11 +28,11 @@ class IOSTransition extends Animation {
|
||||
this.leavingItem = navCtrl.getStagedLeavingItem();
|
||||
|
||||
// create animation for the entering item
|
||||
let enteringItemAnimation = new Animation(this.enteringItem.navItem.domElement);
|
||||
let enteringItemAnimation = new Animation(this.enteringItem.domElement);
|
||||
|
||||
// create animation for the leaving item
|
||||
// leavingItem could be null, but the animation instance knows to do nothing
|
||||
let leavingItemAnimation = new Animation(this.leavingItem && this.leavingItem.navItem.domElement);
|
||||
let leavingItemAnimation = new Animation(this.leavingItem && this.leavingItem.domElement);
|
||||
|
||||
// entering item moves to center
|
||||
// before starting, set enteringItem to display: block
|
||||
|
Reference in New Issue
Block a user