Question

我们有一个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 () { }
    });

此代码通过用户的交互和路由更改来延迟加载。

我们如何在我们的模块中包含此组件？伪代码可能是：

    module.AddComponent(tasks);

Answer 1

您可以尝试使用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 () { }
        });

如何在Angular 2中动态加载组件，而不在NgModule的声明部分中列出它们

1 个答案: