honeymoose/angular-cn
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
modules/@angular/router/src/directives/router_outlet.ts
View File

@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license * 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 {RouterOutletMap} from '../router_outlet_map';
import {ActivatedRoute} from '../router_state'; import {ActivatedRoute} from '../router_state';
@ -72,7 +72,8 @@ export class RouterOutlet {
activate( activate(
activatedRoute: ActivatedRoute, loadedResolver: ComponentFactoryResolver, activatedRoute: ActivatedRoute, loadedResolver: ComponentFactoryResolver,
providers: ResolvedReflectiveProvider[], outletMap: RouterOutletMap): void { loadedInjector: Injector, providers: ResolvedReflectiveProvider[],
outletMap: RouterOutletMap): void {
this.outletMap = outletMap; this.outletMap = outletMap;
this._activatedRoute = activatedRoute; this._activatedRoute = activatedRoute;
@ -99,7 +100,9 @@ export class RouterOutlet {
factory = snapshot._resolvedComponentFactory; 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 = this.location.createComponent(factory, this.location.length, inj, []);
this.activated.changeDetectorRef.detectChanges(); this.activated.changeDetectorRef.detectChanges();

11
modules/@angular/router/src/router.ts
View File

@ -696,14 +696,17 @@ class ActivateRoutes {
const config = closestLoadedConfig(this.futureState.snapshot, future.snapshot); const config = closestLoadedConfig(this.futureState.snapshot, future.snapshot);
let loadedFactoryResolver: ComponentFactoryResolver = null; let loadedFactoryResolver: ComponentFactoryResolver = null;
let loadedInjector: Injector = null;
if (config) { if (config) {
const loadedResolver = config.factoryResolver; loadedFactoryResolver = config.factoryResolver;
loadedFactoryResolver = loadedResolver; loadedInjector = config.injector;
resolved.push({provide: ComponentFactoryResolver, useValue: loadedResolver}); 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 { private deactivateOutletAndItChildren(outlet: RouterOutlet): void {

5
modules/@angular/router/test/router.spec.ts
View File

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

2
tools/public_api_guard/router/index.d.ts vendored
View File

@ -194,7 +194,7 @@ export declare class RouterOutlet {
isActivated: boolean; isActivated: boolean;
outletMap: RouterOutletMap; outletMap: RouterOutletMap;
constructor(parentOutletMap: RouterOutletMap, location: ViewContainerRef, resolver: ComponentFactoryResolver, name: string); 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; deactivate(): void;
} }