SAPUI5 - 如何根据模型数据更改FeedListItem的样式?

时间:2017-08-21 08:45:03

标签: sapui5

我在Xml中有一个FeedList:

<List
id="msgList"
showSeparators="Inner"
items="{msgData>/msgData}" >
<FeedListItem
    sender="{msgData>UserName}"
    icon="{msgData>userPicture}"
    senderPress="onSenderPress"
    iconPress="onIconPress"
    iconDensityAware="false"
    info="{msgData>Type}"
    timestamp="{msgData>Date}"
    text="{msgData>Text}"
    class="{msgData>Type}"
    maxCharacters="1000"/>

我需要每个Feed项根据我从模型中收到的数据来改变样式

var oDate = new Date();
var msgData = { msgData:[{
    Title: "",
    Text: "Loading...",
    UserName: "AyTee",
    userPicture:"image.png"
}]};
var oModelMockIntention = new JSONModel(msgData);
this.fragment.setModel(oModelMockIntention, "msgData");

最好的方法是什么?

1 个答案:

答案 0 :(得分:0)

您可以在FeedListItem的text属性中使用格式化程序,并且在该方法中您可以使用此实例并使用addStyleClass和removeStyleClass方法来更新该特定FeedListItem的样式,如下所述:

 <List
id="msgList"
showSeparators="Inner"
items="{msgData>/msgData}" >
<FeedListItem
    sender="{msgData>UserName}"
    icon="{msgData>userPicture}"
    senderPress="onSenderPress"
    iconPress="onIconPress"
    iconDensityAware="false"
    info="{msgData>Type}"
    timestamp="{msgData>Date}"
    text="{parts: ['msgData>Text', 'msgData>Type'],formatter:'.updateColor'}"
    maxCharacters="1000"/>

在视图的控制器中,您可以使用下面提到的方法:

 updateColor:function(text, type){
       this.addStyleClass(type);
       return text;
    }