SAP 电商云 Spartacus UI Angular Component 动态创建的单步调试

JerryWang_汪子熙 - 2021-11-16 15:04:29

Jerry 之前的文章SAP 产品 UI 里的容器组件的概念和开发概述介绍过，SAP Spartacus Angular Component，通过我们开发团队自定义的指令 cxComponentWrapper 进行渲染。

在运行时，根据 Angular Component 的名称，即第90行 flexType 字段包含的 QuickOrderComponent，我们能够使用 Angular Component 动态创建 API 来触发这个 Component 的渲染。

default-component.handler.ts 里，调用 viewContainerRef 的 createComponent 方法，创建 Component 实例。

待创建的 Component 如果 constructor 里定义了外部依赖，需要完成这些依赖的创建和注入：

这里待注入的 token 就是 QuickOrderFacade：

这里解析出的 provider 是 QuickOrderService：

CoreModule 一旦被加载，下图第6行 facadeProviders 里的 provider 定义立即生效：

也就是说，运行时，QuickOrderService 会成为 QuickOrderFacade 的具体实现：

更多Jerry的原创文章，尽在："汪子熙":

特别申明：本文内容来源网络，版权归原作者所有，如有侵权请立即与我们联系（cy198701067573@163.com），我们将及时处理。