refactor(bootstrap): use ionicBootstrap() to bootstrap

BREAKING CHANGES:

- Ionic's custom decorators have been removed.
- `@App` and `@Page` should be replaced with `@Component`.
- `IonicApp` has been renamed to `App`.
- `ionicBootstrap` is required to bootstrap the app.
- Config is now the 3rd parameter in `ionicBootstrap(rootComponent,
providers, config)`.
- Property `prodMode` is now a config option, enabling or disabling
production mode.
This commit is contained in:
Adam Bradley
2016-05-31 15:42:06 -05:00
parent 4b4092b25e
commit 73635f3939
19 changed files with 210 additions and 275 deletions

View File

@ -1,11 +1,12 @@
import {ViewContainerRef, DynamicComponentLoader, provide, ReflectiveInjector, ResolvedReflectiveProvider, ElementRef, NgZone, Renderer, Type} from '@angular/core';
import {ViewContainerRef, DynamicComponentLoader, provide, ReflectiveInjector, ResolvedReflectiveProvider, ElementRef, NgZone, Renderer, Type, EventEmitter} from '@angular/core';
import {addSelector} from '../../config/bootstrap';
import {App} from '../app/app';
import {Config} from '../../config/config';
import {Ion} from '../ion';
import {IonicApp} from '../app/app';
import {isBlank, pascalCaseToDashCase} from '../../util/util';
import {Keyboard} from '../../util/keyboard';
import {NavParams} from './nav-params';
import {pascalCaseToDashCase, isBlank} from '../../util/util';
import {MenuController} from '../menu/menu-controller';
import {NavPortal} from './nav-portal';
import {SwipeBackGesture} from './swipe-back';
@ -59,12 +60,9 @@ import {ViewController} from './view-controller';
*
*
* ## Page creation
* _For more information on the `@Page` decorator see the [@Page API
* reference](../../../decorators/Page/)._
*
* Pages are created when they are added to the navigation stack. For methods
* like [push()](#push), the NavController takes any component class that is
* decorated with `@Page` as its first argument. The NavController then
* decorated with `@Component` as its first argument. The NavController then
* compiles that component, adds it to the app and animates it into view.
*
* By default, pages are cached and left in the DOM if they are navigated away
@ -75,10 +73,12 @@ import {ViewController} from './view-controller';
*
* ## Lifecycle events
* Lifecycle events are fired during various stages of navigation. They can be
* defined in any `@Page` decorated component class.
* defined in any component type which is pushed/popped from a `NavController`.
*
* ```ts
* @Page({
* import {Component} from '@angular/core';
*
* @Component({
* template: 'Hello World'
* })
* class HelloWorld {
@ -171,6 +171,14 @@ export class NavController extends Ion {
protected _trnsTime: number = 0;
protected _views: Array<ViewController> = [];
pageDidLoad: EventEmitter<any>;
pageWillEnter: EventEmitter<any>;
pageDidEnter: EventEmitter<any>;
pageWillLeave: EventEmitter<any>;
pageDidLeave: EventEmitter<any>;
pageWillUnload: EventEmitter<any>;
pageDidUnload: EventEmitter<any>;
/**
* @private
*/
@ -203,7 +211,7 @@ export class NavController extends Ion {
constructor(
parent: any,
protected _app: IonicApp,
protected _app: App,
config: Config,
protected _keyboard: Keyboard,
elementRef: ElementRef,
@ -227,6 +235,14 @@ export class NavController extends Ion {
this.providers = ReflectiveInjector.resolve([
provide(NavController, {useValue: this})
]);
this.pageDidLoad = new EventEmitter();
this.pageWillEnter = new EventEmitter();
this.pageDidEnter = new EventEmitter();
this.pageWillLeave = new EventEmitter();
this.pageDidLeave = new EventEmitter();
this.pageWillUnload = new EventEmitter();
this.pageDidUnload = new EventEmitter();
}
/**
@ -508,6 +524,7 @@ export class NavController extends Ion {
animation: enteringView.getTransitionName('back')
});
// present() always uses the root nav
// start the transition
return rootNav._insertViews(-1, [enteringView], opts);
}
@ -819,9 +836,11 @@ export class NavController extends Ion {
// 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.fireWillLeave();
this.pageWillLeave.emit(leavingView);
return parentNav.pop(opts).then((rtnVal: boolean) => {
leavingView.fireDidLeave();
this.pageDidLeave.emit(leavingView);
return rtnVal;
});
}
@ -919,6 +938,7 @@ export class NavController extends Ion {
// the first view to be removed, it should init leave
view.state = STATE_INIT_LEAVE;
view.fireWillUnload();
this.pageWillUnload.emit(view);
// from the index of the leaving view, go backwards and
// find the first view that is inactive so it can be the entering
@ -952,7 +972,9 @@ export class NavController extends Ion {
// apart of any transitions that will eventually happen
this._views.filter(v => v.state === STATE_REMOVE).forEach(view => {
view.fireWillLeave();
this.pageWillLeave.emit(view);
view.fireDidLeave();
this.pageDidLeave.emit(view);
this._views.splice(this.indexOf(view), 1);
view.destroy();
});
@ -987,6 +1009,7 @@ export class NavController extends Ion {
// if no entering view then create a bogus one
enteringView = new ViewController();
enteringView.fireLoaded();
this.pageDidLoad.emit(enteringView);
}
/* Async steps to complete a transition
@ -1043,6 +1066,7 @@ export class NavController extends Ion {
this.loadPage(enteringView, null, opts, () => {
enteringView.fireLoaded();
this.pageDidLoad.emit(enteringView);
this._postRender(transId, enteringView, leavingView, isAlreadyTransitioning, opts, done);
});
}
@ -1102,12 +1126,14 @@ export class NavController extends Ion {
// only fire entering lifecycle if the leaving
// view hasn't explicitly set not to
enteringView.fireWillEnter();
this.pageWillEnter.emit(enteringView);
}
if (enteringView.fireOtherLifecycles) {
// only fire leaving lifecycle if the entering
// view hasn't explicitly set not to
leavingView.fireWillLeave();
this.pageWillLeave.emit(leavingView);
}
} else {
@ -1214,12 +1240,14 @@ export class NavController extends Ion {
// only fire entering lifecycle if the leaving
// view hasn't explicitly set not to
enteringView.fireDidEnter();
this.pageDidEnter.emit(enteringView);
}
if (enteringView.fireOtherLifecycles) {
// only fire leaving lifecycle if the entering
// view hasn't explicitly set not to
leavingView.fireDidLeave();
this.pageDidLeave.emit(leavingView);
}
}
@ -1422,21 +1450,25 @@ export class NavController extends Ion {
return;
}
// add more providers to just this page
let providers = this.providers.concat(ReflectiveInjector.resolve([
provide(ViewController, {useValue: view}),
provide(NavParams, {useValue: view.getNavParams()})
]));
// automatically set "ion-page" selector
addSelector(view.componentType, 'ion-page');
// load the page component inside the nav
this._loader.loadNextToLocation(view.componentType, this._viewport, providers).then(component => {
// 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;