WinJs列表视图显示:没有ID的瓦片

问题描述:

那么问题是什么。我想从具有特定参数的WinJS列表视图中排除项目(ID - 从JSON传递)。怎么做?WinJs列表视图显示:没有ID的瓦片

事情我已经尝试:

一)将数据推送到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; 
} 

提前致谢!

建议要么使用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(...); 
+0

我明天早上检查一下,并给出反馈。谢谢! – karlisup 2013-04-08 08:38:41

+0

真棒,工作! – karlisup 2013-04-10 16:21:16