WinJs列表视图显示:无图块ID

时间:2013-04-07 21:15:04

标签: javascript listview windows-store-apps winjs

那么问题是什么。我想从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显示:无

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

提前感谢!

1 个答案:

答案 0 :(得分:1)

建议在使用array.filter构建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(...);