是否有可能在UI5结合sap.ui.base.ManagedObject到视图

Question

我有一个显示在sap.m.Input控制员工姓名如下

<mvc:View 
    controllerName="com.naveen.test.managedobject.controller.Employee" 
    xmlns="sap.m" 
    xmlns:mvc="sap.ui.core.mvc" 
    height="100%"> 
    <Input 
     value="{/name}" 
     liveChange="onDataChange" 
     type="Text" /> 
</mvc:View> 

而且视图模型类如此处所示基于hint.。

sap.ui.define(["sap/ui/base/ManagedObject"], 
    function(ManagedObject) { 
    "use strict"; 
    var Employee = ManagedObject.extend("com.naveen.test.managedobject.model.Employee", { 
     metadata : { 
      properties : { 
       name : { type : "string", defaultValue:"" } 
      } 
     }, 
     set name(iName) { 
      this.setName(iName); 
     }, 
     get name() { 
      return this.getName(); 
     } 
    }); 
    return Employee; 
}); 

和Controller我只是创造了员工模型一个对象，并将其设置为下面的视图。

sap.ui.define(["sap/ui/core/mvc/Controller", 
      "sap/ui/model/json/JSONModel",  
      "com/naveen/test/managedobject/model/Employee"], 
function(Controller,JSONModel,Employee) { 
    "use strict"; 
    return Controller.extend("com.naveen.test.managedobject.controller.Employee", { 
     onInit : function() { 
      var employee = new Employee({ 
       name : "Naveen" 
      }); 
      this.model = new JSONModel(employee); 
      this.getView().setModel(this.model); 
     }, 
     onDataChange : function(oEvent) { 
      var value = oEvent.getParameter("value"); 
      console.log("Value in control", value); 
      console.log("Value in model", this.model.getData().getName()); 
     } 
    }); 
}); 

但是，该视图并未从模型中获取数据，并且模型中的任何更改都未更新模型。在这个方法中是否有任何错误，或者我们如何将托管对象的属性绑定到视图。

Answer 1

我真的不能测试此所以有可能与下面的问题，但这个想法是：

• 实例化JSON模型，并将其附加到包含{name: 'Naveen'}的看法。
• 实例化一个新Employee指向名在JSON模型
• 附加员工到屏幕

所以像：

this.getView().setModel(new JSONModel({name:'Naveen'})); 

// this is UI5 databinding. `{/name}` references the variable called 'name' 
// in the unnamed model, like above 
var employee = new Employee({name: '{/name}'); 
this.getView().addContent(employee); 

你可能要考虑通过阅读浏览OpenUI5文档中的应用程序，它会告诉你有关数据绑定的所有信息。 Here是最新版本（1.48）的链接，您还可以找到其他版本。

---

说明封装，这是由JSON模型完成的。数据可以使用

this.getModel().getProperty('/name') //get 
this.getModel().setProperty('/name', 'NotNaveen') //set. 

这将传播通过绑定系统名称的变化（在这种情况下，它会在Employee更改名称）进行访问。

如果你想在模型中势必name输入字段：

this.getView().addContent(new Input({value: '{/name}')); 

---

什么你可以做的，就是延长JSONModel并调用它EmployeeModel。在构造函数中，设置你想要的任何结构并调用超级构造函数。它可以像JSONModel可以绑定等一样使用 - 同时还可以控制内部的数据。

所以要真正回答你的问题：不，你不应该这样使用ManagedObject，使用JSONModel。

Answer 2

是的，但有一点解决方法。 我有一个自定义的BusinessObjectModel，它是标准JSONModel的继承，但模型中的每个条目实际上都是一个类的实例。

见本github上存储库： https://github.com/FiddleBe/UI5-BusinessObjectModel 这是一个如何使用对象实例作为模型项和绑定对象属性的视图的示例。

那里有很多额外的功能，比如脱机持久性，你可能不需要。

我的基础BusinessObject（您必须为您的员工继承）基于EventProvider而不是managedobject。但由于managedobject继承了EventProvider，所以也许有可能改变基础BusinessObject的扩展...无论如何..无论如何..

几个重要注意事项： 您需要在每次执行一个事件（在我的实现PropertyUpdated中）属性是从您的二传手“设置” ：

this.fireEvent("propertyUpdated", { 
    reason: sap.ui.model.ChangeReason.Binding, 
    path: "/<yourpropertyname>", 
    value: this.<yourproperty> 
}); 

在模型中继承，您需要订阅这个事件，每一个对象实例出现在设置中的条目。你可以做到这一点在使用setData继承

ObjectModel.prototype.setData = function (oData, bMerge) { 
    var aData = []; 
    this.oData = []; 

    if (oData instanceof Array) { 
     aData = oData; 
    } else { 
     aData.push(oData); 
    } 

    for (var i = 0; i < aData.length; i++) { 
     var oObject = aData[i]; 
     if (this.objectClass && oObject instanceof this.objectClass) { 
     //is already an object instance.. don't change. 
     oObject.attachPropertyUpdated({ basePath: "/" + i }, this.onPropertyUpdated, this); 
     }else if (this.objectClass) { 
      oObject = new this.objectClass.getObject(aData[i], "/" + i); 
      oObject.attachPropertyUpdated({ basePath: "/" + i }, this.onPropertyUpdated, this); 
     } else { 
      oObject = aData[i]; 
     } 
     this.oData = this.oData.concat(oObject); 
    } 

    arguments[0] = this.oData.concat();//not very clean 

    Model.prototype.setData.apply(this, arguments); 
}; 

看看在GitHub上的图书馆，以及：https://github.com/FiddleBe/library 它包含了更先进的日期执行。