如何有條件地渲染角度組件

Question

假設我的項目中具有以下結構。 對於每個聲明自定義組件的客戶端，它都有一個模塊；如果該客戶端沒有實現，則有一個公共模塊聲明默認組件。

/company-module-a/register-form-screen
/company-module-a/register-form-screen/part-1-form-component
/company-module-a/register-form-screen/part-2-form-component

/company-module-b/register-form-screen/
/company-module-b/register-form-screen/part-1-form-component
/company-module-b/register-form-screen/part-4-form-component

/common-module/register-form-screen/
/common-module/register-form-screen/part-1-form-component
/common-module/register-form-screen/part-2-form-component
/common-module/register-form-screen/part-3-form-component
/common-module/register-form-screen/part-4-form-component

我希望默認情況下使用通用組件，然后使用公司組件（如果其組件具有相同的名稱，然后使用公司組件），但是在Angular中是不可能的。 另一種解決方案是在所有模塊中實現所有組件，如果公司模塊與通用模塊沒有區別，只需對其進行擴展，然后通過路由導入該模塊。 還有其他解決此結構問題的解決方案，以提高代碼重用性嗎？ 公司模塊由當前經過身份驗證的用戶的公司名稱定義，並存儲在瀏覽器本地存儲中。

Answer 1

由於組件選擇器是在編譯時由角度編譯器解析的，因此您需要一個結構指令來將組件分辨率推遲到運行時。

例如，您可以使用*ngIf或*ngSwitch選擇要渲染的組件。

請注意，此方法要求捆綁所有組件，而不管在運行時實際使用哪個組件。 如果您有很多組件，或者在乎捆綁包的大小，那么最好按每個公司編譯單獨的捆綁包。