無法動態加載組件

我試圖創建一個示例應用程序，我想在父組件的按鈕單擊事件中動態加載組件。但是，當我點擊按鈕組件未加載，而是在瀏覽器控制檯中收到以下錯誤。請訪問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/[email protected]/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/[email protected]/dist/zone.js:322:35) 
    at Zone.run (https://npmcdn.com/[email protected]/dist/zone.js:216:44) 
    at https://npmcdn.com/[email protected]/dist/zone.js:571:58 
    at ZoneDelegate.invokeTask (https://npmcdn.com/[email protected]/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/[email protected]/dist/zone.js:355:43) 
    at Zone.runTask (https://npmcdn.com/[email protected]/dist/zone.js:256:48)

來源

2016-07-15 Krishnan

如果查詢你需要確保它被實例化@ViewChild(Loader, ...)。爲此，您需要添加Loader到directives: [...]

directives: [Loader] 
}) 
export class App {

Plunker example

來源

2016-07-15 20:17:15

我接受這個答案，同樣的邏輯/代碼，我在我的項目應用，並試圖在本地，我包括在該組件在被加載指令。但仍然在瀏覽器控制檯中發現異常，並且組件未正確加載。你可以請回應這個查詢http://stackoverflow.com/questions/38360904/typeerror-cannot-read-property-createcomponent-of-undefined – Krishnan

在您共享的plunker，它創建實例多次低於其他，而不是有可能用新實例替換現有的實例，當我點擊按鈕，即在任何時間點，我只想要加載一個實例，任何想法如何做到這一點？ – Krishnan

對不起，我忘了你的評論。「收件箱」並不像你收到很多評論時那樣舒服......我回答了http://stackoverflow.com/questions/38442546/how-to-avoid-creating-multiple-instance-of -the-相同組分 –

無法動態加載組件

回答

相關問題