refactor(router): use DynamicComponentLoader instead of ViewContainer

This commit is contained in:
Brian Ford 2015-05-15 15:55:26 -07:00
parent 5db89071d4
commit 83b97c485b
1 changed files with 24 additions and 17 deletions

View File

@ -3,7 +3,7 @@ import {isBlank, isPresent} from 'angular2/src/facade/lang';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
import {Attribute} from 'angular2/src/core/annotations_impl/di';
import {Compiler, ViewContainerRef} from 'angular2/core';
import {DynamicComponentLoader, ComponentRef, ElementRef} from 'angular2/core';
import {Injector, bind} from 'angular2/di';
import * as routerMod from './router';
@ -31,21 +31,24 @@ import {Instruction, RouteParams} from './instruction'
selector: 'router-outlet'
})
export class RouterOutlet {
_compiler:Compiler;
_injector:Injector;
_parentRouter:routerMod.Router;
_childRouter:routerMod.Router;
_viewContainer:ViewContainerRef;
_loader:DynamicComponentLoader;
_componentRef:ComponentRef;
_elementRef:ElementRef;
constructor(viewContainer:ViewContainerRef, compiler:Compiler, router:routerMod.Router, injector:Injector, @Attribute('name') nameAttr:String) {
constructor(elementRef:ElementRef, loader:DynamicComponentLoader, router:routerMod.Router, injector:Injector, @Attribute('name') nameAttr:String) {
if (isBlank(nameAttr)) {
nameAttr = 'default';
}
this._loader = loader;
this._parentRouter = router;
this._childRouter = null;
this._viewContainer = viewContainer;
this._compiler = compiler;
this._elementRef = elementRef;
this._injector = injector;
this._childRouter = null;
this._componentRef = null;
this._parentRouter.registerOutlet(this, nameAttr);
}
@ -53,26 +56,30 @@ export class RouterOutlet {
* Given an instruction, update the contents of this viewport.
*/
activate(instruction:Instruction): Promise {
// if we're able to reuse the component, we just have to pass along the
// if we're able to reuse the component, we just have to pass along the instruction to the component's router
// so it can propagate changes to its children
if (instruction.reuse && isPresent(this._childRouter)) {
return this._childRouter.commit(instruction);
}
return this._compiler.compileInHost(instruction.component).then((pv) => {
this._childRouter = this._parentRouter.childRouter(instruction.component);
var outletInjector = this._injector.resolveAndCreateChild([
bind(RouteParams).toValue(new RouteParams(instruction.params)),
bind(routerMod.Router).toValue(this._childRouter)
]);
this._viewContainer.clear();
this._viewContainer.create(pv, 0, null, outletInjector);
this._childRouter = this._parentRouter.childRouter(instruction.component);
var outletInjector = this._injector.resolveAndCreateChild([
bind(RouteParams).toValue(new RouteParams(instruction.params)),
bind(routerMod.Router).toValue(this._childRouter)
]);
if (isPresent(this._componentRef)) {
this._componentRef.dispose();
}
return this._loader.loadNextToExistingLocation(instruction.component, this._elementRef, outletInjector).then((componentRef) => {
this._componentRef = componentRef;
return this._childRouter.commit(instruction);
});
}
deactivate():Promise {
return (isPresent(this._childRouter) ? this._childRouter.deactivate() : PromiseWrapper.resolve(true))
.then((_) => this._viewContainer.clear());
.then((_) =>this._componentRef.dispose());
}
canDeactivate(instruction:Instruction): Promise<boolean> {