2017-05-14 107 views
0

我有不同類型的對象。不過,我想在我的一個Angular2組件中顯示所有類型。 下面是我使用的代碼:根據文件夾結構添加代碼行 - 預編譯器?

in for-loop: 
<div [ngSwitch]="Type"> 
    <c-test *ngSwitchCase="'Test'"></c-test> 
    <c-test2 *ngSwitchCase="'Test2'"></c-test2> 
    <etc> 
</div> 

隨着時間的推移,我的應用程序可能會擴大,對象增加新的「類型」。由於我在不同的地方使用了上面的代碼,所以我不想爲每個添加的類型在所有這些地方添加一行。有沒有辦法使用類似於C++預編譯器的東西來檢查我的文件夾結構並相應地添加這些行?

例如:假設我有以下文件夾結構。

Objects 
|- TypeA 
|- TypeB 
|- etc 

在我的代碼,我會再有這樣的事情:

<div [ngSwitch]="Type"> 
    <precompile *ngFor="some looping through folders">  
     <"c-$FoundFolder" *ngSwitchCase="'$FoundFolder'"><"c-$FoundFolder"> 
    </precompile> 
</div> 

結果造成:

<div [ngSwitch]="Type"> 
    <c-TypeA *ngSwitchCase="'TypeA'"></c-TypeA> 
    <c-TypeB *ngSwitchCase="'TypeB'"></c-TypeB> 
    <etc *ngSwitchCase="'etc'"></c-etc> 
</div> 

我知道什麼,我想以這種形式不存在,但有沒有辦法實現類似的東西,如果是的話,怎麼樣?

回答

1

以下方法不能完全按照您的要求工作。但是,基本的意圖是在未來根據添加到應用程序中的新組件的情況動態加載新組件。有對角的網站一個很好的文章在此:

https://angular.io/docs/ts/latest/cookbook/dynamic-component-loader.html

只是,它會保持相同的組件的新的聲明,只是你需要在entryComponent爲每個新組件的附加條目在同一個模塊文件加入其中,新的組件聲明:

entryComponents: [ HeroJobAdComponent, HeroProfileComponent ],

+0

非常感謝你,這似乎是非常接近我想做的事!我會嘗試一下並評論它是如何發展的。 – user2065501

+0

這個方法有一個小問題。在文檔中,他們使用一個函數返回所有可能的組件和他們的數據。但是,我想通過只知道名稱來加載組件(或類似的東西)。基本上,以文檔爲例:代替'',其中廣告已經加載,我想這樣做:'',其中MyAdType是一個字符串或文件或用於通過add-banner加載組件的任何內容。那可能嗎? – user2065501

+0

你可以請你創建一個示例plunker並解釋我想要達到什麼目的。可能那時我將能夠幫助你。謝謝! – Lambo14