Question

我使用Angular 2与.Net Core和Webpack。我正在尝试将动态模块加载到我的应用程序中。这是应用程序组件：

＆＃13;

//our root app component
import { NgModule } from '@angular/core'
import { BrowserModule } from '@angular/platform-browser'
import {
	Component,
	ViewContainerRef,
	Compiler,
	ComponentFactory,
	ComponentFactoryResolver,
	ModuleWithComponentFactories,
	ComponentRef,
	ReflectiveInjector,
	SystemJsNgModuleLoader,
	AfterViewInit,
	OnInit,
	NgModuleFactory
} from '@angular/core';

export class ModuleNode { modulePath: string; componentName: string; }

@Component({
    selector: 'app',
    template: require('./app.component.html'),
    styles: [require('./app.component.css')]
})
export class AppComponent implements AfterViewInit {

	widgetConfig: string;
	module: ModuleNode;
	cmpRef: ComponentRef<any>;

	constructor(private viewref: ViewContainerRef,
		private resolver: ComponentFactoryResolver,
		private loader: SystemJsNgModuleLoader,
		private compiler: Compiler) {
		this.module = new ModuleNode();
		this.module.modulePath = "./dynamic.module";
		this.module.componentName = "TestComponent";
	}

	ngAfterViewInit() {
		this.openWebApp(this.module);
	}

	ngOnInit() {
		
	}


	openWebApp(menu: any) {
		this.loader.load(menu.modulePath)  // load the module and its components
			.then((modFac) => {
				this.compiler.compileModuleAndAllComponentsAsync<any>(modFac.moduleType)

					.then((factory: ModuleWithComponentFactories<any>) => {
						return factory.componentFactories.find(x => x.componentType.name === menu.componentName);
					})
					.then(cmpFactory => {

						// need to instantiate the Module so we can use it as the provider for the new component
						let modRef = modFac.create(this.viewref.parentInjector);
						this.cmpRef = this.viewref.createComponent(cmpFactory, 0, modRef.injector);
						// done, now Module and main Component are known to NG2

					});
			});
	}

	ngOnDestroy() {
		if (this.cmpRef) {
			this.cmpRef.destroy();
		}
	}
}

＆＃13;

at＆＃34; this.loader.load（menu.modulePath）＆＃34;我得到一个错误＆＃34;系统未定义＆＃34;。据我所知，它可能是SystemJs的一部分，可能会丢失，但在.Net Core和Webpack中，它不再是必需的。我是对的吗？

Answer 1

感谢yurzui，我将webpack更改为版本2，错误消失了。

但现在我有一个问题就是找到模块。我得到“vendor.js：59947 EXCEPTION：./AppComponent类AppComponent_Host中的错误 - 内联模板：0：0导致：找不到模块'./dynamic.module'。”

我也试过'./dynamic.module.ts','./ClientApp/app/components/app/dynamic.module.ts' 并且在从File。

加载之前需要（“./ dynamic.module.ts”）

SystemJsNgModuleLoader＆＃34;系统未定义＆＃34;

1 个答案: