无法动态加载组件答案

【问题标题】：Not able to load component dynamically无法动态加载组件
【发布时间】：2016-07-15 19:58:06
【问题描述】：

我尝试创建一个示例应用程序，我想在父组件的按钮单击事件上动态加载组件。但是，当我单击按钮时，组件未加载，而是在浏览器控制台中收到以下错误。申请代码请访问plunker

zone.js:461Unhandled Promise rejection: Cannot read property 'createComponent' of undefined ; Zone: angular ; Task: Promise.then ; Value: TypeError: Cannot read property 'createComponent' of undefined
    at eval (https://run.plnkr.co/EQ3xbfuUPWfMTU2C/src/app.ts!transpiled:38:45)
    at ZoneDelegate.invoke (https://npmcdn.com/zone.js@0.6.12/dist/zone.js:323:29)
    at Object.onInvoke (https://npmcdn.com/@angular/core/bundles/core.umd.js:9100:45)
    at ZoneDelegate.invoke (https://npmcdn.com/zone.js@0.6.12/dist/zone.js:322:35)
    at Zone.run (https://npmcdn.com/zone.js@0.6.12/dist/zone.js:216:44)
    at https://npmcdn.com/zone.js@0.6.12/dist/zone.js:571:58
    at ZoneDelegate.invokeTask (https://npmcdn.com/zone.js@0.6.12/dist/zone.js:356:38)
    at Object.onInvokeTask (https://npmcdn.com/@angular/core/bundles/core.umd.js:9091:45)
    at ZoneDelegate.invokeTask (https://npmcdn.com/zone.js@0.6.12/dist/zone.js:355:43)
    at Zone.runTask (https://npmcdn.com/zone.js@0.6.12/dist/zone.js:256:48)

【问题讨论】：

标签： angular

【解决方案1】：

如果您查询@ViewChild(Loader, ...)，您需要确保它已被实例化。为此，您需要将Loader 添加到directives: [...]

  directives: [Loader]
})
export class App {

Plunker example

【讨论】：

我接受这个答案，我在项目中应用的相同逻辑/代码并在本地尝试过，我在指令中包含了要加载的组件。但我仍然在浏览器控制台中遇到异常并且组件未正确加载。你能回复这个问题吗stackoverflow.com/questions/38360904/…
在您共享的 plunker 中，它会在一个下方多次创建实例，而是可以在我单击按钮时用新实例替换现有实例，即在任何时候有时我只想加载一个实例，有什么想法吗？
对不起，我忘记了你的评论。当您收到很多 cmets 时，“收件箱”并不像它可能的那样舒服......我在 stackoverflow.com/questions/38442546/… 上回答了