UI5

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

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

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

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

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

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

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


一旦connectToView执行之后,

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

CRM WebClient UI

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

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

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

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

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

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

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

要获取更多Jerry的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:

SAP UI5和CRM WebUI的View和Controller是如何绑定的的更多相关文章

  1. SAP成都研究院C4C光明左使:SAP Cloud for Customer 使用SAP UI5的独特之处

    大家好,今天的文章来自我的同事,Yang Joey. 2017年7月,SAP成都研究院C4C开发团队刚刚建立.某个周一早晨的Scrum meeting,新出现一位眉清目秀的小伙子,向大家自我介绍:&q ...

  2. Fiori Fundamentals和SAP UI5 Web Components

    这周有位同事邀请我给团队讲一讲SAP技术的演进历史,所以我准备了下面几个主题来介绍. 其中SAP的技术回顾和演进,我的思路就是从前后台两方面分别介绍. 我画了一张非常简单的图: 去年5月我写过一篇文章 ...

  3. OPEN(SAP) UI5 学习入门系列之二: 最佳实践练习(上)

    这篇博文难产了很久,原来是打算一周更新一篇的,上周原计划写MVC,但是写了一半,发现带入了太多的细节,不太符合这个入门系列的主题. 当我们学习一个新的技能的时候,如果一开始就面对大量的细节,很容易陷入 ...

  4. SAP UI5和微信小程序对比之我见

    今天继续由SAP成都研究院著名的菜园子小哥Wang Cong,给大家分享他作为一个SAP前端人员是如何看待SAP UI5和微信小程序的异同点的. 关于Wang Cong种菜的手艺,大家请移步到他以前的 ...

  5. 在Kubernetes上运行SAP UI5应用(上)

    2018年只剩最后30天了.Jerry在2017年的最后一天,曾经立下一个目标:这个微信公众号在2018年保证至少每周发布一篇SAP原创技术文章. 从Jerry在后台统计的2018全年文章数量来看,这 ...

  6. OPEN(SAP) UI5 学习入门系列之二: 最佳实践练习(下)

    上期我们完成了一个简单的主从页面,但是页面是静态的,不能交互,功能也很简单,只有一个销售订单的列表. 我们今天就一鼓作气把代码全都写完,由于本次的代码量较大,所以只对重点代码部分进行讲解. 具体每个文 ...

  7. 关于SAP UI5数据绑定我的一些原创内容

    如何查找SAP UI5官方关于数据绑定的文档: https://sapui5.hana.ondemand.com/ 点Documentation: Filter里输入data就能看到Data Bind ...

  8. HTML5开发移动web应用——SAP UI5篇(8)

    本次对之前学习的SAP UI5框架知识进行简单小结.以及重点部分知识的梳理. 1.在UI5使用过程中,命名空间的概念非常重要. 2.一般的sap组件引用格式例如以下: sap.ui.define([ ...

  9. HTML5开发移动web应用——SAP UI5篇(6)

    <span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255) ...

随机推荐

  1. Educational Codeforces Round 3 B

    B. The Best Gift time limit per test 2 seconds memory limit per test 256 megabytes input standard in ...

  2. PHP服务器文件管理器开发小结(九):jQuery动态表单实现文件下载

    前文讨论的文件操作,无论是新建.编辑.移动.删除,都是服务端对本地文件系统的操作.这一节需要讨论一个涉及服务端和客户端协调进行的操作:文件下载. 简单的文件下载可以通过将相对路径写入超链接的方式进行, ...

  3. 单点登录-JWT(Json Web Tokens)

    来自:http://www.ruanyifeng.com/blog/2018/07/json_web_token-tutorial.html 1.跨域认证 1.用户向服务器发送用户名和密码. 2.服务 ...

  4. 使用spyder编译器单步调试python

    1.将需要进行单步调试的函数在脚本中进行调用(十分重要的一步).由于python是解释型语言,在进行单步调试的时候需要告诉系统你使用了这个函数,单步调试才会进入你所需要调式的函数.如下图所示,我们定义 ...

  5. js实现放大镜效果

    原理: 鼠标在小图片上移动时,通过捕捉鼠标在小图片上的位置,定位大图片的相应位置: 放大镜的移动方向和大图片的移动方向:横向和纵向都是相反,才可以保证同步: 需要元素:大图和小图,存放大图和小图的容器 ...

  6. java——注解Annotation

    http://www.cnblogs.com/xdp-gacl/p/3622275.html 元注解: @Retention:当 @Retention 应用到一个注解上的时候,它解释说明了这个注解的的 ...

  7. vue 中使用driver.js来进行页面分步引导

    Driver.js 推荐15款最佳的 jQuery 分步引导插件 11 个超棒的 jQuery 分步指引插件

  8. 转 使用utl_http获取某个http页面内容

    #########1.ACL详细解释: 11g 对于XDB  UTL_HTTP or others package 的权限管控进一步加强,如果需要使用到XDB 以下包 UTL_TCP, UTL_SMT ...

  9. python django 基本测试

    http://www.runoob.com/django/django-model.html django-admin startapp TestModel /models.py from djang ...

  10. matlab 图像和 opencv 图像的相互转换

    matlab可以生成C++代码, 但是在涉及图像数据的时候,要注意数据格式的转换. 1. Matlab图像数据在内存中的存放顺序是R通道图,G通道图,B通道图.对于每个通道,数据存放是先列后行. 2. ...