fix(router): lazy loaded components should use loaded injector

This commit is contained in:
vsavkin 2016-07-18 16:07:12 -07:00
parent 7a4f6621ed
commit 921a17960c
4 changed files with 18 additions and 9 deletions

View File

@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
import {Attribute, ComponentFactory, ComponentFactoryResolver, ComponentRef, Directive, EventEmitter, NoComponentFactoryError, Output, ReflectiveInjector, ResolvedReflectiveProvider, ViewContainerRef} from '@angular/core';
import {Attribute, ComponentFactory, ComponentFactoryResolver, ComponentRef, Directive, EventEmitter, NoComponentFactoryError, Output, ReflectiveInjector, ResolvedReflectiveProvider, ViewContainerRef, Injector} from '@angular/core';
import {RouterOutletMap} from '../router_outlet_map';
import {ActivatedRoute} from '../router_state';
@ -72,7 +72,8 @@ export class RouterOutlet {
activate(
activatedRoute: ActivatedRoute, loadedResolver: ComponentFactoryResolver,
providers: ResolvedReflectiveProvider[], outletMap: RouterOutletMap): void {
loadedInjector: Injector, providers: ResolvedReflectiveProvider[],
outletMap: RouterOutletMap): void {
this.outletMap = outletMap;
this._activatedRoute = activatedRoute;
@ -99,7 +100,9 @@ export class RouterOutlet {
factory = snapshot._resolvedComponentFactory;
}
const inj = ReflectiveInjector.fromResolvedProviders(providers, this.location.parentInjector);
const injector = loadedInjector ? loadedInjector : this.location.parentInjector;
const inj = ReflectiveInjector.fromResolvedProviders(providers, injector);
this.activated = this.location.createComponent(factory, this.location.length, inj, []);
this.activated.changeDetectorRef.detectChanges();

View File

@ -696,14 +696,17 @@ class ActivateRoutes {
const config = closestLoadedConfig(this.futureState.snapshot, future.snapshot);
let loadedFactoryResolver: ComponentFactoryResolver = null;
let loadedInjector: Injector = null;
if (config) {
const loadedResolver = config.factoryResolver;
loadedFactoryResolver = loadedResolver;
resolved.push({provide: ComponentFactoryResolver, useValue: loadedResolver});
loadedFactoryResolver = config.factoryResolver;
loadedInjector = config.injector;
resolved.push({provide: ComponentFactoryResolver, useValue: loadedFactoryResolver});
};
outlet.activate(future, loadedFactoryResolver, ReflectiveInjector.resolve(resolved), outletMap);
outlet.activate(
future, loadedFactoryResolver, loadedInjector, ReflectiveInjector.resolve(resolved),
outletMap);
}
private deactivateOutletAndItChildren(outlet: RouterOutlet): void {

View File

@ -1279,14 +1279,17 @@ describe('Integration', () => {
[Router, TestComponentBuilder, Location, AppModuleFactoryLoader],
(router: Router, tcb: TestComponentBuilder, location: Location,
loader: SpyAppModuleFactoryLoader) => {
class LazyLoadedService {}
@Component({selector: 'lazy', template: 'lazy-loaded', directives: ROUTER_DIRECTIVES})
class LazyLoadedComponent {
constructor(service: LazyLoadedService) {}
}
@AppModule({
precompile: [LazyLoadedComponent],
providers: [
provideRoutes([{
LazyLoadedService, provideRoutes([{
path: '',
canActivate: ['alwaysTrue'],
children: [{path: 'loaded', component: LazyLoadedComponent}]

View File

@ -194,7 +194,7 @@ export declare class RouterOutlet {
isActivated: boolean;
outletMap: RouterOutletMap;
constructor(parentOutletMap: RouterOutletMap, location: ViewContainerRef, resolver: ComponentFactoryResolver, name: string);
activate(activatedRoute: ActivatedRoute, loadedResolver: ComponentFactoryResolver, providers: ResolvedReflectiveProvider[], outletMap: RouterOutletMap): void;
activate(activatedRoute: ActivatedRoute, loadedResolver: ComponentFactoryResolver, loadedInjector: Injector, providers: ResolvedReflectiveProvider[], outletMap: RouterOutletMap): void;
deactivate(): void;
}