如何在Angular2 +中基於運行時約束動態顯示不同的組件類型？

-1

有一個分離器組件總是在頂部包含一個網格。次要組件將顯示在分離器的底部。輔助組件的類型將取決於網格中選定的行類型。選擇第1行，次要組件可能是折線圖選擇第2行，次要組件可能是另一個網格... 隨着用戶更改所選行，顯示的組件和數據將需要更新。

關於如何設置它的任何想法？

2017-08-14 reza

爲什麼你不能簡單地使用'* ngIf' /'[ngSwitch]'指令呢？ –

您可以使用[ngSwitch]指令動態加載第二個組件。

如果要動態加載它們，建立與此類似

<div [ngSwitch]="variable"> 
    <app-first *ngSwitchCase="1"></app-first> 
    <app-second *ngSwitchCase="2"></app-second> 
</div>

這是給你，你將如何確定應加載哪個組件代碼。例如，您可以使用純JavaScript的jQuery更改變量的值以呈現特定組件。如果更改行，組件將自動更新。

如果你想的那麼從第一個組件的數據匹配第二自動更新內容，你必須使用由Angular4提供了一些跨組件通信。好解釋如何在這裏做到這一點：https://www.youtube.com/watch?v=I317BhehZKM

2017-08-14 17:46:17

ngSwitch優於ComponentFactoryResolver的優點是什麼？ – reza

從我所知道的使用ComponentFactoryResolver是更好的方法，因爲它更面向對象，更容易測試和擴展，但是有一些缺點需要處理。我對ComponentFactoryResolver沒有多少經驗，但是從我的經驗來看，ngSwitch對於那些你不需要擴展你的項目的中小型項目是很好的。 –

回答