javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-22 13:32:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

Feature/observable ext (#6670)

Browse Source 
* refactor(nav-controller): refactor to better support dynamic component loading
This commit is contained in:
Dan Bucholtz
2016-05-27 13:49:37 -05:00
parent 4ba999e6a4
commit dfa991d409
12 changed files with 524 additions and 160 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
src/components/nav/nav-controller.ts
View File

@ -818,10 +818,10 @@ export class NavController extends Ion {
if (!parentNav['_tabs']) {
// Tabs can be a parent, but it is not a collection of views
// only we're looking for an actual NavController w/ stack of views
leavingView.willLeave();
leavingView.fireWillLeave();
return parentNav.pop(opts).then((rtnVal: boolean) => {
leavingView.didLeave();
leavingView.fireDidLeave();
return rtnVal;
});
}
@ -918,7 +918,7 @@ export class NavController extends Ion {
// set that it is the init leaving view
// the first view to be removed, it should init leave
view.state = STATE_INIT_LEAVE;
view.willUnload();
view.fireWillUnload();
// from the index of the leaving view, go backwards and
// find the first view that is inactive so it can be the entering
@ -951,8 +951,8 @@ export class NavController extends Ion {
// remove views that have been set to be removed, but not
// apart of any transitions that will eventually happen
this._views.filter(v => v.state === STATE_REMOVE).forEach(view => {
view.willLeave();
view.didLeave();
view.fireWillLeave();
view.fireDidLeave();
this._views.splice(this.indexOf(view), 1);
view.destroy();
});
@ -986,7 +986,7 @@ export class NavController extends Ion {
if (!enteringView) {
// if no entering view then create a bogus one
enteringView = new ViewController();
enteringView.loaded();
enteringView.fireLoaded();
}
/* Async steps to complete a transition
@ -1042,19 +1042,8 @@ export class NavController extends Ion {
this.setTransitioning(true, 500);
this.loadPage(enteringView, null, opts, () => {
if (enteringView.onReady) {
// this entering view needs to wait for it to be ready
// this is used by Tabs to wait for the first page of
// the first selected tab to be loaded
enteringView.onReady(() => {
enteringView.loaded();
this._postRender(transId, enteringView, leavingView, isAlreadyTransitioning, opts, done);
});
} else {
enteringView.loaded();
this._postRender(transId, enteringView, leavingView, isAlreadyTransitioning, opts, done);
}
enteringView.fireLoaded();
this._postRender(transId, enteringView, leavingView, isAlreadyTransitioning, opts, done);
});
}
}
@ -1112,13 +1101,13 @@ export class NavController extends Ion {
if (leavingView.fireOtherLifecycles) {
// only fire entering lifecycle if the leaving
// view hasn't explicitly set not to
enteringView.willEnter();
enteringView.fireWillEnter();
}
if (enteringView.fireOtherLifecycles) {
// only fire leaving lifecycle if the entering
// view hasn't explicitly set not to
leavingView.willLeave();
leavingView.fireWillLeave();
}
} else {
@ -1224,13 +1213,13 @@ export class NavController extends Ion {
if (leavingView.fireOtherLifecycles) {
// only fire entering lifecycle if the leaving
// view hasn't explicitly set not to
enteringView.didEnter();
enteringView.fireDidEnter();
}
if (enteringView.fireOtherLifecycles) {
// only fire leaving lifecycle if the entering
// view hasn't explicitly set not to
leavingView.didLeave();
leavingView.fireDidLeave();
}
}
@ -1440,56 +1429,61 @@ export class NavController extends Ion {
// load the page component inside the nav
this._loader.loadNextToLocation(view.componentType, this._viewport, providers).then(component => {
// the ElementRef of the actual ion-page created
let pageElementRef = component.location;
// a new ComponentRef has been created
// set the ComponentRef's instance to its ViewController
view.setInstance(component.instance);
// the component has been loaded, so call the view controller's loaded method to load any dependencies into the dom
view.loaded( () => {
// the ElementRef of the actual ion-page created
let pageElementRef = component.location;
// remember the ChangeDetectorRef for this ViewController
view.setChangeDetector(component.changeDetectorRef);
// remember the ChangeDetectorRef for this ViewController
view.setChangeDetector(component.changeDetectorRef);
// remember the ElementRef to the ion-page elementRef that was just created
view.setPageRef(pageElementRef);
// remember the ElementRef to the ion-page elementRef that was just created
view.setPageRef(pageElementRef);
// auto-add page css className created from component JS class name
let cssClassName = pascalCaseToDashCase(view.componentType['name']);
this._renderer.setElementClass(pageElementRef.nativeElement, cssClassName, true);
view.onDestroy(() => {
// ensure the element is cleaned up for when the view pool reuses this element
this._renderer.setElementAttribute(pageElementRef.nativeElement, 'class', null);
this._renderer.setElementAttribute(pageElementRef.nativeElement, 'style', null);
component.destroy();
});
if (!navbarContainerRef) {
// there was not a navbar container ref already provided
// so use the location of the actual navbar template
navbarContainerRef = view.getNavbarViewRef();
}
// find a navbar template if one is in the page
let navbarTemplateRef = view.getNavbarTemplateRef();
// check if we have both a navbar ViewContainerRef and a template
if (navbarContainerRef && navbarTemplateRef) {
// let's now create the navbar view
let navbarViewRef = navbarContainerRef.createEmbeddedView(navbarTemplateRef);
// auto-add page css className created from component JS class name
let cssClassName = pascalCaseToDashCase(view.componentType['name']);
this._renderer.setElementClass(pageElementRef.nativeElement, cssClassName, true);
view.onDestroy(() => {
// manually destroy the navbar when the page is destroyed
navbarViewRef.destroy();
// ensure the element is cleaned up for when the view pool reuses this element
this._renderer.setElementAttribute(pageElementRef.nativeElement, 'class', null);
this._renderer.setElementAttribute(pageElementRef.nativeElement, 'style', null);
component.destroy();
});
}
// options may have had a postLoad method
// used mainly by tabs
opts.postLoad && opts.postLoad(view);
if (!navbarContainerRef) {
// there was not a navbar container ref already provided
// so use the location of the actual navbar template
navbarContainerRef = view.getNavbarViewRef();
}
// our job is done here
done(view);
// find a navbar template if one is in the page
let navbarTemplateRef = view.getNavbarTemplateRef();
// check if we have both a navbar ViewContainerRef and a template
if (navbarContainerRef && navbarTemplateRef) {
// let's now create the navbar view
let navbarViewRef = navbarContainerRef.createEmbeddedView(navbarTemplateRef);
view.onDestroy(() => {
// manually destroy the navbar when the page is destroyed
navbarViewRef.destroy();
});
}
// options may have had a postLoad method
// used mainly by tabs
opts.postLoad && opts.postLoad(view);
// our job is done here
done(view);
});
});
}