2
我正在創建自定義控件並將數據綁定到它。點擊按鈕時,我正在更改模型中的數據,但是DOM中沒有反映這一點。作爲SAP-UI5的新手,我無法弄清楚這個問題。任何幫助,將不勝感激。自定義控件中的雙向綁定在SAPUI5中不起作用
我使用的代碼:
var aData = { person : [{firstName:"Bruce", lastName:"Wayne"}] };
//set Model
var oModel = new sap.ui.model.json.JSONModel(aData);
sap.ui.getCore().setModel(oModel);
//Declaring Renderer
jQuery.sap.declare("PersonRenderer");
PersonRenderer={render : function (oRm, oControl){
oRm.write("<ul style = 'margin:20px 50px;'");
oRm.writeControlData(oControl);
oRm.write(">");
var aItems = oControl.getModel().getData().persons;
for(var i=0,l=aItems.length; i<l; i++){
oRm.write("<li style='padding-top : 20px; font-size : 16px; border : 1px solid #cecece; color : #006699; font-weight : bold'> ");
oRm.write(aItems[i].firstName);
oRm.write(" ");
oRm.write(aItems[i].last);
oRm.write("</li>");
}
oRm.write("</ul");
} }
//Creating custom Element for binding.
//**Can we skip this and use existing controls like *TextField***???//
sap.ui.core.Element.extend("PersonItems",{
metadata : {
properties : {
"first" : {type : "string"},
"last" : {type : "string"}
}
} });
//Declaring custom control
sap.ui.core.Control.extend("Person",{
metadata : {
properties : {
aggregations : {
"items" : {type : "PersonItems", multiple : true, singularName : "Name_Singular"}
},
defaultAggregation : "items"
},
renderer : PersonRenderer
} });
//creating custom control
var mPerson = new Person({
items : {
path : "/persons",
template : new PersonItems({ first : "{firstName}", last : "{last}"})
}
});
//Creating a button
var oBtn = new sap.ui.commons.Button('btn',{
text : "Click",
press : function(){
//changed the model's property
var model = sap.ui.getCore().getModel();
model.setProperty("/persons/0/last",'Dog');
}
})
mPerson.placeAt('master');
oBtn.placeAt('master');
按鈕的按下功能更改模型,但視圖不更新。如何更新點擊按鈕和模型更改的視圖。
另外,在使用renderer函數時,PersonRenderer.js是自動創建的。直接放置渲染功能不起作用。是什麼原因?這是因爲聚合綁定?和sapui5的例子一樣,這個工作正常。
我看到你在自定義控件('oControl.getModel()。getData()。persons')中引用了一個模型,這是一個不可以;-) 總是使用生成的getters/setters,即我相信'oControl.getItems()'爲'物品'聚合在你的情況 – Qualiture