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

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

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

image.png



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

image.png


image.png



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

image.png


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

image.png


这里待注入的 token 就是 QuickOrderFacade:


image.png

这里解析出的 provider 是 QuickOrderService:


image.png

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


image.png


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


image.png


相关文章
|
1月前
|
Web App开发 数据采集 前端开发
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
15 0
|
1月前
|
XML 开发框架 前端开发
浅谈 Angular 和 UI5 这两种前端框架里控件 ID 的设计思路差异
浅谈 Angular 和 UI5 这两种前端框架里控件 ID 的设计思路差异
13 0
|
3月前
|
消息中间件 存储 监控
什么是 SAP CRM Middleware Component 里的 PRODUCT_R3_ADAPTER
什么是 SAP CRM Middleware Component 里的 PRODUCT_R3_ADAPTER
24 0
|
19天前
什么是 SAP ABAP 里的 Subscreen
什么是 SAP ABAP 里的 Subscreen
15 1
什么是 SAP ABAP 里的 Subscreen
|
19天前
|
网络架构 开发者 UED
Spartacus 2211 的 provideOutlet 方法扩展 UI
Spartacus 2211 的 provideOutlet 方法扩展 UI
10 0
Spartacus 2211 的 provideOutlet 方法扩展 UI
|
1月前
|
安全 开发者
如何在 SAP ERP 系统调试 Product Initial Download
如何在 SAP ERP 系统调试 Product Initial Download
23 0
|
1月前
|
中间件
如何在 SAP CRM 系统调试 Product Initial Download
如何在 SAP CRM 系统调试 Product Initial Download
15 0
|
3月前
|
搜索推荐 开发者 UED
关于 SAP Spartacus 层的 UI 设计
关于 SAP Spartacus 层的 UI 设计
40 0
|
5月前
|
开发者
SAP UI5 控件双向数据绑定后显示数据出问题,可以调试这个方法
SAP UI5 控件双向数据绑定后显示数据出问题,可以调试这个方法
28 0
|
6月前
|
前端开发 UED Windows
关于 SAP_UI software component 的概要介绍
关于 SAP_UI software component 的概要介绍
47 0