脚本宝典收集整理的这篇文章主要介绍了html5教程-HTML5开发移动web应用――SAP UI5篇(5)，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

 sap.ui.define([    "sap/ui/core/mvc/Controller",    "sap/m/MessageToast",    "sap/ui/model/json/JSONModel"], function (Controller, MessageToast, JSONModel) {    "use strict";    return Controller.extend("sap.ui.demo.wt.controller.App", {       onInIT : function () {          // set data model on view          VAR oData = {             recipient : {                name : "World"             }          };          var oModel = new JSONModel(oData);          this.getView().setModel(oModel);       },       onShowHello : function () {          MessageToast.show("Hello World");       }    }); });

 <;mvc:view controllername="sap.ui.demo.wt.controller.App" XMlns="sap.m" xMLns:mvc="sap.ui.core.mvc"><button text="Say Hello" Press="onShowHello"></button><input value="{/recipient/name}" description="Hello {/recipient/name}" valueliveupdate="true" width="60%" data-cke-editable="1" contenteditable="false"><button text="Say Hello" PRess="onShowHello"></button></mvc:view>

了解掌握了MVC中的V和C，这次我们来学习一下M数据模型这一部分的内容。

首先，修改App.controller.js文件的内容，代码如下：

 sap.ui.define([    "sap/ui/core/mvc/Controller",    "sap/m/MessageToast",    "sap/ui/model/json/JSONModel"], function (Controller, MessageToast, JSONModel) {    "use strict";    return Controller.extend("sap.ui.demo.wt.controller.App", {       onInit : function () {          // set data model on view          var oData = {             recipient : {                name : "World"             }          };          var oModel = new JSONModel(oData);          this.getView().setModel(oModel);       },       onShowHello : function () {          MessageToast.show("Hello World");       }    }); });

其中，onInit方法相当于构造函数，载入controller后自动调用。以上代码构造了一个Model，通过setModel方法在视图中使用setModel方法（和SenchaTouch相同）。

在App.view.js文件中修改如下：

 <mvc:view controllername="sap.ui.demo.wt.controller.App" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc"><button text="Say Hello" press="onShowHello"></button><input value="{/recipient/name}" description="Hello {/recipient/name}" valueliveupdate="true" width="60%" data-cke-editable="1" contenteditable="false"><button text="Say Hello" press="onShowHello"></button></mvc:view>

经过如上的修改，我们就完成了数据模型的引用。以上也就是一个在SAPUI5中完整的MVC框架结构。

觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ html5教程，巧夺天工，精雕玉琢。小宝典献丑了！

脚本宝典总结

以上是脚本宝典为你收集整理的html5教程-HTML5开发移动web应用――SAP UI5篇(5)全部内容，希望文章能够帮你解决html5教程-HTML5开发移动web应用――SAP UI5篇(5)所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。