`
JerryWang_SAP
  • 浏览: 1043294 次
  • 性别: Icon_minigender_1
  • 来自: 成都
文章分类
社区版块
存档分类
最新评论

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

阅读更多

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的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:

 
 
0
0
分享到:
评论

相关推荐

    SAP UI5 文档

    SAP UI5(用户界面5)是SAP公司开发的一个用于创建企业级Web应用程序的框架,特别是那些与SAP系统交互的应用程序。SAP UI5建立在HTML5、CSS3和JavaScript的基础上,使用了响应式设计原则,让应用程序可以在各种设备...

    SAP UI5打包成APP

    在如今数字化转型的浪潮中,SAP UI5作为一种面向企业级应用的开发框架,越来越多的企业选择使用它来构建和部署应用程序。SAP UI5以其丰富的控件库、良好的集成性以及适应性而受到企业的青睐。然而,随着移动设备的...

    SAP UI5入门概述

    通过以上步骤,开发者可以初步了解 SAP UI5 和 SAP Fiori 的基本概念,并掌握如何搭建一个基础的开发环境来实践 SAP UI5 开发。这对于初学者来说是非常宝贵的资源,有助于快速入门并深入了解 SAP UI5 技术栈。

    SAP UI5入门

    SAP UI5 的软件开发包(SDK)包括一系列有用的工具和资源: - **开发者指南**:概述了 SAP UI5 使用的编程语言、开源技术、开发工具以及 API 的相关信息。 - **控件部分**:包含运行中的示例演示,这些示例包含了对...

    sapui5-runtime

    【SAP UI5运行时环境】,又称为`sapui5-runtime`,是SAP公司推出的一款强大的前端开发框架,专为构建企业级的Web应用程序而设计。它基于OpenUI5,一个开源版本的UI5,因此也带有"openui5"的标签。SAP UI5提供了一个...

    SAPUI5-Training

    - **应用架构**:SAPUI5的应用程序遵循MVC(Model-View-Controller)模式,使得逻辑清晰、结构层次分明,便于维护和扩展。 - **Model**:数据模型,负责管理应用程序的数据。 - **View**:视图层,展示数据并处理...

    SAP UI5 Reference for SAP HANA

    文档《SAP UI5 Reference for SAP HANA》提供了关于如何在SAP HANA平台上开发和运行SAP UI5应用程序的详细指南。它包含多个章节,涵盖了从安装SAP UI5应用程序工具到支持应用程序国际化、本地化、测试,以及最终在...

    sap ui5表单例子

    SAP UI5是SAP公司推出的一款用于构建企业级Web应用程序的开源框架,它提供了丰富的用户界面元素和强大的数据绑定功能,使得开发人员能够轻松创建交互式、响应式的应用。 ### SAP UI5概述 SAP UI5基于HTML5技术,...

    SAP UI5 OVERVIEW

    总之,SAP UI5 作为 SAP 公司的核心前端框架之一,不仅拥有丰富的组件和强大的功能,还在不断地进化和完善之中。借助 SAP 的 Web 应用程序工具包,开发者能够更高效地构建出高质量的企业级应用。

    SAPUI5_InstGuide

    考虑到文档中出现的商标和版权声明,我们可以了解SAP UI5是由SAP公司开发的,并且与其他SAP产品和服务(例如SAP R/3、SAP NetWeaver、SAP HANA等)一样,具有重要的知识产权保护。此外,文档提到了SAP产品和服务名称...

    SAPUI5 详细讲解

    SAPUI5不仅提供了一套完整的开发工具链,还具备高度的可扩展性和兼容性,是构建现代化企业级Web应用的理想选择。无论是初学者还是经验丰富的开发者,都能从中找到合适的工具和资源,快速构建高质量的业务应用。

    Tutorial to Develop a SAPUI5 Application with oData Access

    接下来,我们将使用SAPUI5的Model、View和Controller来与oData服务进行交互。在Controller中,我们将创建一个新的`sap.ui.model.odata.ODataModel`实例,传入`epmServiceUrl`,并设置`useBatch`参数为`false`,以便...

    SAPUI5开发环境配置

    它提供了丰富的UI控制库、灵活的数据绑定机制以及模块化的应用程序架构,使得开发者能够快速地构建高性能的Web应用。为了更好地使用SAPUI5进行开发,搭建一个合适的开发环境是必不可少的。 #### 二、SAPUI5开发环境...

    sap ui5通用组件例子

    SAP UI5 是一个用于构建企业级 Web 应用的框架,它由 SAP 公司开发,提供了丰富的 UI 控件库和强大的数据绑定机制。UI5 的通用组件(commons)是这个控件库的一部分,包含了多种常见且实用的 UI 元素,如按钮、...

    SAP UI5 OData开发

    在深入探讨SAP UI5 OData开发之前,需要明确几个关键点:SAP UI5是一个前端开发框架,而OData(Open Data Protocol)是一种基于Web的协议,允许创建和消费可查询和可更新的数据服务。SAP Gateway是SAP NetWeaver的一...

    sap ui5表格例子

    SAP UI5 提供了 sap.m.Table 控件来实现这一功能,本示例将详细介绍如何使用 SAP UI5 的表格控件进行数据展示和绑定。 首先,创建一个 SAP UI5 应用的基本结构,包括 index.html、manifest.json 和控制器(如:...

    sap.m.sample.Image.zip_UI5_sap ui5_sap.m.Image

    【标题】"sap.m.sample.Image.zip_UI5_sap ui5_...同时,也会接触到SAP UI5应用的基本结构,包括控制器、视图、组件和数据绑定等概念。对于初学者来说,这是一个很好的起点,能够帮助他们逐步掌握SAP UI5的开发技能。

    SAP UI5 官方培训文档(100页+)

    ### SAP UI5 官方培训文档关键知识点解析 #### 一、SAP UI5 概览...通过以上内容,我们可以看到SAP UI5不仅具备强大的功能和技术特性,还有一套完善的开发流程和支持体系,使得开发者能够高效地构建高质量的企业应用。

    SAPUI5(SAP Fiori)开发技术要求

    它被广泛用于SAPUI5应用中,以简化数据模型和数据绑定。 3. 开发环境和工具:开发者应该熟悉SAP的开发环境和工具,如Eclipse、SAP GUI、Web IDE、SAP Build和Theme Designer。Eclipse是一个广泛使用的集成开发环境...

    SAPUI5概述 学习PPT 内容详细讲解

    SAPUI5概述(SAPUI5 Overview) 讲解SAPUI5如何搭建,如何开发应用。 说明,文档为英文 内容如下: SAPUI5 Overview Runtime Resources Programming Applications SAPUI5 Developer Studio Creating a SAPUI5 ...

Global site tag (gtag.js) - Google Analytics