Javascript 如何在Angular 2中动态加载组件，而不在NgModule'中列出它们；海关申报组

我们有一个SPL，其中在

index.html

中，ngModule的定义如下：

var module = ng.core.NgModule({
        imports: [ng.platformBrowser.BrowserModule, ng.router.RouterModule, ng.material.MaterialModule],
        declarations: [],
        bootstrap: []
    })
    .Class({
        constructor: function () {}
    });

document.addEventListener('DOMContentLoaded', function () {
    ng.platformBrowserDynamic
        .platformBrowserDynamic()
        .bootstrapModule(module);
});

如您所见，我们的

NgModule

中的声明列表为空。例如，此代码由开发人员A完成，并与

index.html一起加载到页面中

在另一个地方，开发人员B创建了一个简单的组件：

var tasks = ng.core.Component({
        selector: 'tasks',
        template: '<div>list of tasks here<div>'
    })
    .Class({
        constructor: function () {}
    });

您可以尝试使用forwardRef，但我不确定它是否有效，因为我没有任何代码可供测试

 var module = ng.core.NgModule({
            imports: [ng.platformBrowser.BrowserModule, ng.router.RouterModule, ng.material.MaterialModule],
            declarations: [ng.core.forwardRef(() => tasks],
            bootstrap: []
        })
        .Class({
            constructor: function () { }
        });

 var module = ng.core.NgModule({
            imports: [ng.platformBrowser.BrowserModule, ng.router.RouterModule, ng.material.MaterialModule],
            declarations: [ng.core.forwardRef(() => tasks],
            bootstrap: []
        })
        .Class({
            constructor: function () { }
        });