假设我的项目中有以下结构。它为每个客户端提供一个模块,用于声明自定义组件和一个公共模块,如果此客户端没有实现,则声明默认组件。
/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 中这是不可能的。另一种解决方案是在所有模块中实现所有组件,如果公司模块与普通模块没有区别,只需扩展它,然后通过路由导入模块。是否有其他解决方案可以解决此结构问题,从而提高代码重用性?公司模块由当前认证用户的公司名称定义,保存在浏览器本地存储中。
由于组件选择器在编译时由 angular 编译器解析,因此您需要一个结构指令来将组件解析推迟到运行时。
例如,您可以使用*ngIf
或*ngSwitch
选择要渲染的组件。
请注意,此方法要求捆绑所有组件,而不管在运行时实际使用哪些组件。如果您有很多组件,或者关心包的大小,那么为每个公司编译单独的包可能是更好的方法。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句