WinJs列表视图显示:无带ID的tile

WinJs List View display:none tile with ID

本文关键字：ID tile 无带 列表 视图 显示 WinJs      更新时间：2023-09-26

那么问题是什么呢?我想排除项目从WinJS列表视图与特定参数(ID -从JSON传递)。怎么做呢?

我尝试过的事情:

a)在将数据压入someView之前。itemDataSource用这个函数处理它(它的工作，但看起来脏)。

    fldView.itemDataSource = this._processItemData(Data.items.dataSource);
    ....
     _processItemData: function (data) {
        for (var i = data.list.length; i >= 1; i--) {
            if (data.list._groupedItems[i]) {
                if (data.list._groupedItems[i].groupKey == 'Folders')
                    continue;
                else {
                    if (data.list._groupedItems[i].data.folderID) {
                        data.list.splice(i - 1, 1);
                    }
                }
            }
        }
        return data;
    }

b)两个条件模板的传统方式(不工作):

 fldView.itemTemplate = this.getItemTemplate;
    ....
    getItemTemplate: function(promise){
                return promise.then(function(item){
                    var
                        itemTemplate = null,
                        parent = document.createElement("div");
                    if(item.data.folderID){
                        itemTemplate = document.querySelector('.hideItemTemplate')
                    }else{
                        itemTemplate = document.querySelector('.itemTemplate')
                    }
                    //console.log(item.data.folderID);
                    itemTemplate.winControl.render(item.data, parent);
                    return parent;
                })
            }

2个HTML模板

<div class="itemTemplate" data-win-control="WinJS.Binding.Template">
        <div class="item">
            <img class="item-image" src="#" data-win-bind="src: backgroundImage; alt: title" />
            <div class="item-overlay">
                <h4 class="item-title" data-win-bind="textContent: title" style="margin-left: 0px;"></h4>
                <h6 class="item-subtitle win-type-ellipsis" data-win-bind="textContent: subtitle" style="margin-left: 0px; margin-right: 4.67px;"></h6>
            </div>
        </div>
    </div>
    <div class="hideItemTemplate" data-win-control="WinJS.Binding.Template">
        <div class="display-none"></div>
    </div>

和CSS display: none

.hideItemTemplate, .display-none{
    display:none;
}

提前感谢!

建议在使用数组构建WinJS.Binding.List之前过滤项。过滤或在列表上做一个过滤投影。如果需要分组，则可以在过滤列表上进行分组。

var list; // assuming this is all data items
var filteredList = list.createFiltered(function filter(item)
    {
        if (item.FolderID)
            return false;
        else
            return true;
    });
var groups = filteredList.createGrouped(...);
相关文章：