Question

我有一个Feed列表，用于在我的UI5 xml视图中发布评论

<layout:content>
    <m:FeedInput post="onFeedPost" class="sapUiSmallMarginTopBottom"/>
    <m:List id="feedList" showSeparators="Inner" items="{path: '/table', sorter: {path: 'DATE', descending: true}}">
        <m:FeedListItem sender="{MEMBERID}" timestamp="{DATE}" text="{COMMENT}" convertLinksToAnchorTags="All"/>
    </m:List>
</layout:content>

我希望不显示具有相同文本和日期的重复注释，但要将它们保留在数据库中。我的想法是在控制器中遍历项目来执行此操作，但我不确定如何处理结果数组

var results = [];
var comments = feed.getItems();

for (var n = 0; n < comments.length - 1; n++) {
    var contained = false; 

    for (var m = n + 1; m < comments.length; m++) {
        if (comments[n].getText() === comments[m].getText() && 
            comments[n].getDate() === comments[m].getDate()) {
            comments.pop(m);

            contained = true;

            if (!results.includes(comments[n])) {
                results.push(comments[n]);
            }
        }
    }

    if (!contained && !results.includes(comments[n])) {
        results.push(comments[n]);
    }
}

// replace list items with results array

我无法弄清楚如何使用新数组替换Feed列表项，因为有getItems函数但不是setItems函数。它发生在我身上可能有一个更简单的更惯用的UI5方法，但我还没有找到它。

Answer 1

首先，处理这种情况的正确方法是在OData服务中。在将数据发送到客户端之前，服务应删除重复项。但是，如果我们假设你不能做这个服务器端，那么你有一些选择。

1。）不要将列表项绑定到任何内容。相反，使用ODataModel读取数据，然后过滤掉重复项，创建一个新的列表项并将其添加到列表中

使用ODataModel读取数据，然后将结果传递给将过滤并将其添加到列表中的方法

oModel.read("/EntitySet", {
    success: function(oResponse) {
        this._addCommentsToList(oResponse.results)
    }.bind(this)
})

在处理结果的方法中，您需要做三件事 - 创建一个新的FeedListItem，设置列表项的绑定上下文，然后将列表项添加到列表中

var aDistinctComments = //use your logic to filter out duplicates
aDistinctComments.forEach(function(oComment) {
    //to set the binding context, you'll need the entity key/path
    var sCommentKey = oModel.createKey("/EntitySet", oComment)
    //create a new binding context
    var oContext = oModel.createBindingContext(sCommentKey)
    //create a new FeedListItem
    var oItem = new FeedListItem({
        sender: "{MemberId}",
        ...
    });
    //set the context of the item and add it to the list
    oItem.setBindingContext(oContext);
    oList.addItem(oItem);
})

2.。）将列表直接绑定到OData实体集，然后当列表接收数据时，遍历项目并隐藏重复项

<List items="{/EntitySet}" updateFinished="onListUpdateFinished"....>

----- onListUpdateFinished ---
var aItems = oList.getItems();
for (var m = n + 1; m < aItems.length; m++) {
    //set a boolean, true if duplicate
    var bDuplicate = aItems[m].getText() ==== aItems[n].getText() &&
                     aItems[m].getDate() === aItems[n].getDate();
    //set the visibility of the item to true if it is not a duplicate
    aItems[m].setVisible(!bDuplicate)
}

3.。）手动读取数据，删除重复项，并将其存储在JSON模型中，并将表绑定到JSON模型路径

oModel.read("/EntitySet", {
    success: function(oResponse) {
        this._addCommentsToJSONModel(oResponse.results)
    }.bind(this)
})

您可以在JSON模型中存储对象数组，然后将表项绑定到该路径

 var aDistinctComments = // your logic to get distinct comments
 oJSONModel.setProperty("/comments", aDistinctComments)
 oList.setModel(oJSONModel);

 -----

 <List items="{/comments"}....>

4.。）将列表项绑定到实体集，迭代项，然后从列表中删除重复项。我不推荐这种方法。从绑定到实体集的列表中手动删除项可能会导致重复ID出现问题。

 var oItem = //use your logic to find a duplicate list item
 oList.removeItem(oItem)

我建议首先在OData服务中处理此服务器端，如果这不是一个选项，则使用上面的选项1。这将为您提供所需的结果并维护列表项的绑定上下文。选项2和3将为您提供所需的结果，但根据您的应用，可能会使列表更难处理。

Answer 2

这是一种方法：

不要直接将列表绑定到oData。您可以创建一个JSON模型，该模型将在删除重复项后成为模型。

将JSON模型绑定到List：

var oList = this.getView().byId("feedList"); oList.bindAggregation("items", "pathToJsonArray", template);

（在这种情况下，模板是feedlistitem）。

UI5删除重复的Feed列表项

2 个答案: