dynamic - 我如何在 Angular 2 中使用 "SystemJsNgModuleLoader"将动态模块导入应用程序?

标签 dynamic angular angular-module

在 Angular 网站中有新的 API SystemJsNgModuleLoader .

有谁知道如何使用此 API 在应用程序中加载动态模块?

最佳答案

我知道您会找到解决方案,但我提供了解决方案供其他人引用。代码已被很好地注释并且很容易理解。

createComponent(fileName, componentName){
    let injector = ReflectiveInjector.fromResolvedProviders([], this.vcRef.parentInjector);
    // 1. Create module loader
    let loader = new SystemJsNgModuleLoader(this.compiler);
    loader.load(fileName).then((nmf:NgModuleFactory<any>)=>{
        // 2. create NgModuleRef
        let ngmRef = nmf.create(injector);
        // 3. Create component factory
        let cmpFactory = ngmRef.componentFactoryResolver.resolveComponentFactory( componentName );
        // 4. Create the component
        let componentRef = this.span.createComponent(cmpFactory,0,injector,[]);
        // 5. Init the component name field.
        componentRef.instance.name = "Some Name";
        // 6. Refresh the component area.
        componentRef.changeDetectorRef.detectChanges();
        componentRef.onDestroy(()=> {
            componentRef.changeDetectorRef.detach();
        });
    });
}

通过使用上述函数,我们可以从任何来源注入(inject)模块。更多请引用this .

关于dynamic - 我如何在 Angular 2 中使用 "SystemJsNgModuleLoader"将动态模块导入应用程序?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39349035/

相关文章:

c# - 使用 .Net 测试 JavaScript 类 - 最佳实践?

c# - 银光 2 : INotifyPropertyChanged on dynamically created object?

angular6 特性模块延迟加载抛出错误TypeError : undefined is not a function

Angular 路由器 : how to pass data to lazy loading module?

javascript - 在 Angular 模块中导出枚举

创建 Material 模块并将其导入 app.module 后,子模块中未应用 Angular Material 主题

javascript - 在网页底部和接近顶部之间动态调整元素的大小

php - 从数据库动态加载元素

angular - ngx-mask 接受负数

angular - 为什么我的 http.put 请求不起作用?均值堆栈