feat(ComponentResolver): Add a SystemJS resolver for compiled apps (#9145)

modules/@angular/compiler/src/runtime_compiler.ts

@@ -62,7 +62,7 @@ export class RuntimeCompiler implements ComponentResolver {
                 compMeta.selector, compiledTemplate.viewFactory, componentType));
   }
 
-  clearCache() {
+  clearCache(): void {
     this._styleCache.clear();
     this._compiledTemplateCache.clear();
     this._compiledTemplateDone.clear();

modules/@angular/core/src/linker.ts

@@ -5,7 +5,7 @@ export {DynamicComponentLoader} from './linker/dynamic_component_loader';
 export {ElementRef} from './linker/element_ref';
 export {ExpressionChangedAfterItHasBeenCheckedException} from './linker/exceptions';
 export {QueryList} from './linker/query_list';
-export {SystemJsComponentResolver} from './linker/systemjs_component_resolver';
+export {SystemJsCmpFactoryResolver, SystemJsComponentResolver} from './linker/systemjs_component_resolver';
 export {TemplateRef} from './linker/template_ref';
 export {ViewContainerRef} from './linker/view_container_ref';
 export {EmbeddedViewRef, ViewRef} from './linker/view_ref';

modules/@angular/core/src/linker/component_resolver.ts

@@ -14,7 +14,7 @@ import {ComponentFactory} from './component_factory';
  */
 export abstract class ComponentResolver {
   abstract resolveComponent(component: Type|string): Promise<ComponentFactory<any>>;
-  abstract clearCache(): any /** TODO #9100 */;
+  abstract clearCache(): void;
 }
 
 function _isComponentFactory(type: any): boolean {
@@ -37,5 +37,6 @@ export class ReflectorComponentResolver extends ComponentResolver {
     }
     return PromiseWrapper.resolve(componentFactory);
   }
+
   clearCache() {}
 }

modules/@angular/core/src/linker/systemjs_component_resolver.ts

@@ -3,6 +3,7 @@ import {Type, global, isString} from '../facade/lang';
 import {ComponentFactory} from './component_factory';
 import {ComponentResolver} from './component_resolver';
 
+const _SEPARATOR = '#';
 
 /**
  * Component resolver that can load components lazily
@@ -13,13 +14,42 @@ export class SystemJsComponentResolver implements ComponentResolver {
 
   resolveComponent(componentType: string|Type): Promise<ComponentFactory<any>> {
     if (isString(componentType)) {
-      return (<any>global)
+      let [module, component] = componentType.split(_SEPARATOR);
-          .System.import(componentType)
+
-          .then((module: any /** TODO #9100 */) => this._resolver.resolveComponent(module.default));
+      if (component === void(0)) {
-    } else {
+        // Use the default export when no component is specified
-      return this._resolver.resolveComponent(<Type>componentType);
+        component = 'default';
-    }
       }
 
-  clearCache() {}
+      return (<any>global)
+          .System.import(module)
+          .then((module: any) => this._resolver.resolveComponent(module[component]));
+    }
+
+    return this._resolver.resolveComponent(componentType);
+  }
+
+  clearCache(): void {}
+}
+
+const FACTORY_MODULE_SUFFIX = '.ngfactory';
+const FACTORY_CLASS_SUFFIX = 'NgFactory';
+
+/**
+ * Component resolver that can load component factories lazily
+ * @experimental
+ */
+export class SystemJsCmpFactoryResolver implements ComponentResolver {
+  resolveComponent(componentType: string|Type): Promise<ComponentFactory<any>> {
+    if (isString(componentType)) {
+      let [module, factory] = componentType.split(_SEPARATOR);
+      return (<any>global)
+          .System.import(module + FACTORY_MODULE_SUFFIX)
+          .then((module: any) => module[factory + FACTORY_CLASS_SUFFIX]);
+    }
+
+    return Promise.resolve(null);
+  }
+
+  clearCache(): void {}
 }

modules/@angular/facade/src/lang.ts

@@ -128,7 +128,7 @@ export function isNumber(obj: any): boolean {
   return typeof obj === 'number';
 }
 
-export function isString(obj: any): boolean {
+export function isString(obj: any): obj is String {
   return typeof obj === 'string';
 }
 

tools/public_api_guard/public_api_spec.ts

@@ -161,7 +161,7 @@ const CORE = [
   'ComponentRef.onDestroy(callback:Function):void',
   'ComponentRef<C>',
   'ComponentResolver',
-  'ComponentResolver.clearCache():any',
+  'ComponentResolver.clearCache():void',
   'ComponentResolver.resolveComponent(component:Type|string):Promise<ComponentFactory<any>>',
   'const APP_ID:any',
   'const APP_INITIALIZER:any',
@@ -512,8 +512,11 @@ const CORE = [
   'SkipSelfMetadataFactory',
   'state(stateNameExpr:string, styles:AnimationStyleMetadata):AnimationStateDeclarationMetadata',
   'style(tokens:string|{[key:string]:string|number}|Array<string|{[key:string]:string|number}>):AnimationStyleMetadata',
+  'SystemJsCmpFactoryResolver',
+  'SystemJsCmpFactoryResolver.clearCache():void',
+  'SystemJsCmpFactoryResolver.resolveComponent(componentType:string|Type):Promise<ComponentFactory<any>>',
   'SystemJsComponentResolver',
-  'SystemJsComponentResolver.clearCache():any',
+  'SystemJsComponentResolver.clearCache():void',
   'SystemJsComponentResolver.constructor(_resolver:ComponentResolver)',
   'SystemJsComponentResolver.resolveComponent(componentType:string|Type):Promise<ComponentFactory<any>>',
   'TemplateRef.createEmbeddedView(context:C):EmbeddedViewRef<C>',
@@ -1356,7 +1359,7 @@ const COMPILER = [
   'RenderTypes.renderNode:CompileIdentifierMetadata',
   'RenderTypes.renderText:CompileIdentifierMetadata',
   'RuntimeCompiler',
-  'RuntimeCompiler.clearCache():any',
+  'RuntimeCompiler.clearCache():void',
   'RuntimeCompiler.constructor(_metadataResolver:CompileMetadataResolver, _templateNormalizer:DirectiveNormalizer, _templateParser:TemplateParser, _styleCompiler:StyleCompiler, _viewCompiler:ViewCompiler, _xhr:XHR, _genConfig:CompilerConfig)',
   'RuntimeCompiler.resolveComponent(component:Type|string):Promise<ComponentFactory<any>>',
   'SourceModule',