SAP UI5和CRM WebUI的View和Controller是如何绑定的

简介: SAP UI5和CRM WebUI的View和Controller是如何绑定的

UI5

例如我在UI5的界面上画一个按钮,点击之后弹出一个Alert dialog。


image.png

在XML view里只定义了controller的名称和事件处理函数的名称。那么按钮被点击之后,controller的onShowHello被触发。但是,这个controller的实例是什么时候被创建, 并且关联到这个申明它的XML view里呢?


image.png


在XMLView.js里,我定义的XML view的源代码被加载之后,XMLView会调用XMLTemplateProcessor, 解析XML view的内容,根据里面的control申明创建对应的UI5控件实例。下图的变量_xContent.innerHTML即为上图XML view的源代码。


image.png


XMLView的实例通过工厂模式创建之后,XMLView源代码里定义的controller名称sap.ui.demo.walkthrough.controller.App,会赋到oView实例的字段_controllerName上。


image.png


View和Controller的绑定是通过这个方法createAndConnectController完成:


connect controller to view after controller and control tree are fully initialized


image.png


Controller的实例也通过工厂模式创建:

image.png


一旦connectToView执行之后,


image.png


oView和oController的关联关系就建立起来了。


image.png


CRM WebClient UI

每个UI component view里有一个built-in的属性controller, 指向这个view对应的controller实例。


image.png


在BSP的编程环境里,开发人员根本无需操心这个controller实例的初始化,直接用就行。


那么View的controller实例究竟在什么时候被框架初始化的?


要自己搞清楚这个问题,可以随便找个BSP UI component做个实验。我找的是PRDHS。在其View的controller CL_PRDHS_HEADER_IMPL的构造函数里设置断点:


image.png


打开该view,从调用栈上下文即可得知BSP框架在什么地方初始化controller实例的。记下这个实例在ABAP runtime的地址编号4633:


image.png


同UI5逻辑类似,在CL_BSP_PAGE_BASE~CREATE_PAGE内部,第190行创建controller的实例并将其同View实例建立关联关系。


image.png


最后运行时View的controller实例4633和之前我们在PRDHS/Header的controller CL_PRDHS_HEADER_IMPL的构造函数中的me指针4633一样,证明两个变量指向的是同一个实例。

image.png


相关文章
|
5月前
|
JSON 数据格式
SAP UI5 Class sap.ui.model.Context 的作用介绍
SAP UI5 Class sap.ui.model.Context 的作用介绍
关于 SAP 电商云 Spartacus UI Navigation Service 执行的一些明细
关于 SAP 电商云 Spartacus UI Navigation Service 执行的一些明细
关于 SAP 电商云 Spartacus UI Navigation Service 执行的一些明细(2)
关于 SAP 电商云 Spartacus UI Navigation Service 执行的一些明细
关于 SAP 电商云 Spartacus UI Navigation Service 执行的一些明细(1)
关于 SAP 电商云 Spartacus UI Navigation Service 执行的一些明细
SAP UI5和CRM WebUI的View和Controller是如何绑定的
UI5 例如我在UI5的界面上画一个按钮,点击之后弹出一个Alert dialog。
SAP UI5和CRM WebUI的View和Controller是如何绑定的
SAP Fiori s2 controller init
SAP Fiori s2 controller init
109 0
SAP Fiori s2 controller init
使用SAP portal service创建Fiori Launchpad
使用SAP portal service创建Fiori Launchpad
128 0
使用SAP portal service创建Fiori Launchpad
SAP Fiori smart template技术里CDS view的注解和UI元素对应关系
SAP Fiori smart template技术里CDS view的注解和UI元素对应关系
221 0
SAP Fiori smart template技术里CDS view的注解和UI元素对应关系
UI Component in CRM WebUI and Hybris
UI Component in CRM WebUI and Hybris
105 0
UI Component in CRM WebUI and Hybris
如何将自开发的SAP UI5应用以tile的方式配置到SAP Fiori Launchpad里
如何将自开发的SAP UI5应用以tile的方式配置到SAP Fiori Launchpad里
如何将自开发的SAP UI5应用以tile的方式配置到SAP Fiori Launchpad里