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选择要渲染的组件。

请注意，此方法要求捆绑所有组件，无论在运行时实际使用哪些组件。如果您有很多组件，或者在乎捆绑包的大小，那么最好按每个公司编译单独的捆绑包。

如何有条件地渲染角度组件

1 个答案: