问题描述
我想从Address.Json模型中读取信息,如下所示:
{
"Street": "Wall St","Zip": "10005","City": "New York","Country": "United states"
}
在Object.view.xml中将它们显示为图像:
<Image class="sapUiSmallMargin" src="{
parts: [
'/address/Street','/address/Zip','/address/City','/address/Country'
],formatter: '.formatter.formatMapUrl'
}" />
并在formatter.js中设置URL的格式,以便使其在ui5应用程序的地图上显示:
sap.ui.define([
'sap/base/security/encodeURL'
],function (encodeURL) {
"use strict";
return {
/**
* Formats an address to a static google maps image
* @public
* @param {string} sstreet the street
* @param {string} sZIP the postal code
* @param {string} sCity the city
* @param {string} sCountry the country
* @returns {string} sValue a google maps URL that can be bound to an image
*/
formatMapUrl: function(sstreet,sZIP,sCity,sCountry) {
var sBaseUrl = "https://maps.googleapis.com/maps/api/staticmap?zoom=13&size=640x640&markers=";
var sEncodedString = encodeURL(sstreet + "," + sZIP + " " + sCity + "," + sCountry);
return sBaseUrl + sEncodedString;
}
};
});
不幸的是,由于格式化程序中的参数未定义,我无法使地图显示在应用程序上:
解决方法
您需要将模型添加到视图以进行绑定。请参阅下面的示例。
Controller.js:
onInit: function () {
var oModel = new JSONModel({
"Street": "Wall St","Zip": "10005","City": "New York","Country": "United states"
});
// Adds JSONModel with name 'addressModel' to the view so you can bind to it
this.getView().setModel(oModel,"addressModel");
}
View.xml:
<Image
class="sapUiSmallMargin"
src="{
parts: [
'addressModel>/Street','addressModel>/Zip','addressModel>/City','addressModel>/Country'
],formatter: '.formatter.formatMapUrl'
}"
/>