Angular2: carga dinámicamente el componente desde el módulo
en mi aplicación angular tengo lo siguiente:
export class MyComponent {
subcompPath = "path-to-subcomp#SubcompClassName";
@ViewChild("placeholder", { read: ViewComponentRef }) placeholderRef: ViewComponentRef;
/* Constructor where Compiler, ComponentFactoryResolver are injected */
loadSubcomponent() {
let [path, componentName] = this.subcompPath.split("#");
(<any>window).System.import(path)
.then((module: any) => module[componentName])
.then((type: any) => {
return this._compiler.compileComponentAsync(type)
})
.then((factory: any) => {
let componentRef = this.placeholderRef.createComponent(factory, 0);
});
}
}
Mi subcomponente declara proveedores y cosas, directivas y tuberías.
Y ahora RC6 está listo para romper todo una vez más. Los componentes no pueden declarar directivas y tuberías, pero deben estar en el módulo donde se declara el componente. Así que tengo que cargar con SystemJS no el componente en sí, sino el módulo. Ok, y luego debería usar
return this._compiler.compileModuleAndAllComponentsAsync(type)
Bien, pero ¿cómo obtengo una referencia a la fábrica de este componente específico? Esa fábrica es todo lo que necesito, el marcador de posición Ref la quiere en su método createComponent, ¿verdad?
Traté de profundizar en el código fuente angular2 desde github pero es bastante vasto, debería intentarlo desde VS Code o algo así, con intellisense, pero soy vago ... y debería leer esto de la documentación, que es bastante mediocre en angular.io para este argumento en particular, que es la carga diferida de componentes y módulos SIN el enrutador.
Se agradece cualquier ayuda, creo que la solución es simple de aplicar pero difícil de encontrar sin documentación oficial.