我想在我的表格列中添加一个图标。应根据值选择图标。因此我实现了一些基于model/formatter.js
文件的格式化函数。
这是我尝试添加表列的代码:
new sap.ui.layout.VerticalLayout({
content: [
new sap.m.Label({text:"{Items>Status}"}),
new sap.ui.core.Icon({
src: {
parts: [
"Items>Status"
],
formatter: Formatter.formatStatusIcon
},
size: "1rem",
color: {
parts: [
"Items>Status"
],
formatter: Formatter.formatStatusIconColor
}
})
]
})
标签显示正确的值。图标不会显示。格式化程序函数的输入值始终为null
,即使值存在且不为空。我使用的是SAPUI5版本1.61.2。我已经尝试了部件属性的不同语法,但它们都没有工作。我还尝试添加一些静态值而不是"Items>Status"
用于测试目的,但格式化函数中的输入仍然是null
。
有谁知道为什么formatter函数的输入总是为空?
根据您的输入,我了解您有一个JS视图,并且您正在根据状态更改Icon及其颜色
View.js
var oTable = new sap.m.Table("idPrdList", {
headerText : "List of Products",
headerDesign : sap.m.ListHeaderDesign.Standard,
mode : sap.m.ListMode.None,
includeItemInSelection : false,
});
var col1 = new sap.m.Column({header: new sap.m.Label({text:"Product Name"})});
oTable.addColumn(col1);
var col2 = new sap.m.Column({header: new sap.m.Label({text:"Description"})});
oTable.addColumn(col2);
var col3 = new sap.m.Column({header: new sap.m.Label({text:"Price"})});
oTable.addColumn(col3);
controller.js
var oModel = new sap.ui.model.json.JSONModel();
oModel.setData({
'items': [
{
'ProductID': "sdf",
'ProductName': "asdf",
"Status": "1"
},
{
'ProductID': "ss",
'ProductName': "asf",
"Status": "1"
},
{
'ProductID': "fff",
'ProductName': "asdf",
"Status": "2"
},
{
'ProductID': "fas",
'ProductName': "asdf",
"Status": "1"
},
{
'ProductID': "asdfa",
'ProductName': "asdfwer",
"Status": "2"
}]
});
sap.ui.getCore().setModel(oModel, "tableData");
var oTable = sap.ui.getCore().byId("idPrdList");
var colItems = new sap.m.ColumnListItem("colItems", {
type: "Active"
});
var txtNAME = new sap.m.Text({
text: "{tableData>ProductID}"
});
colItems.addCell(txtNAME);
var txtNAME2 = new sap.m.Text({
text: "{tableData>ProductName}"
});
colItems.addCell(txtNAME2);
var txtNAME3 = new sap.ui.layout.VerticalLayout({
content: [
new sap.m.Label({
text: "{tableData>Status}"
}),
new sap.ui.core.Icon({
src: {
parts: ["tableData>Status"],
formatter: assets.util.mFormatter.formatStatusIcon
},
size: "1rem",
color: {
parts: ["tableData>Status"],
formatter: assets.util.mFormatter.formatStatusIconColor
}
})
]
})
colItems.addCell(txtNAME3);
oTable.bindAggregation("items", "tableData>/items", colItems);
oTable.setModel(oModel, "tableData");
Formatter.js
jQuery.sap.declare("assets.util.mFormatter");
assets.util.mFormatter = {
formatStatusIcon: function(Status) {
return (Status === "2" ? "ICONPath1" : "ICONPath2");
},
formatStatusIconColor: function(Status) {
return (Status === "2" ? "Color1" : "Color2");
},
};
产量
我认为你的语法错了。删除那些部分的东西。
试试这个:
src="{path: 'invoice>Status',
formatter: '.Formatter.statusText'}
请尝试以下语法:
new sap.ui.layout.VerticalLayout({
content: [
new sap.m.Label({text:"{Items>Status}"}),
new sap.ui.core.Icon({
src: {
parts: [
{path: 'Items>Status'}
],
formatter: '.Formatter.formatStatusIcon'
},
size: "1rem",
color: {
parts: [
"Items>Status"
],
formatter: Formatter.formatStatusIconColor
}
})
]
})