聚合物：在模板的DOM重複

Question

多個過濾器我有一個簡單的DOM重複這樣的：

<template is="dom-repeat" items="{{projects}}" as="project" filter="{{computeFilter(searchString)}}"> 
[[project.name]] - [[project.number]] 
</template> 

<paper-input name="filter-name" label="Filter by project name" value="{{searchString}}"></paper-input> 

還有是按名稱過濾項目的功能：

computeFilter: function(keyword) { 
    if (!keyword) { 
    return null; 
    } else { 
    keyword = keyword.toLowerCase(); 
    return function(project) { 
     var name = project.name.toLowerCase(); 
     return (name.indexOf(keyword) != -1); 
    }; 
    } 
} 

都很好。現在，我將如何去添加另一個過濾器，例如，如果我也想按項目編號過濾？

我將另一個紙張按鈕綁定到{{searchString2}}，但是我怎樣才能將它鏈接到一個過濾器 - 換句話說，我怎樣才能在dom-repeat上設置多個過濾器？

Answer 1

有使用多種過濾器來過濾一個dom-repeat的方式。

首先，這裏的模板：

<paper-input name="filter-name" label="Filter by project name" value="{{filterText::input}}"></paper-input> 
<paper-input name="filter-name" label="Filter by project type" value="{{filterText2::input}}"></paper-input> 
<template id="resultList" is="dom-repeat" items="{{ projects }}" filter="filterProject" as="project"> 
    <div> 
    [[project.name]] - [[project.number]] 
    </div> 
</template> 

你必須爲每個過濾器觀察員刷新過濾器：

this.$.resultList.render(); 

然後，您必須使用過濾器使用過濾器功能：

filterProject: function(item) { 
    return (this.filterText && item.name.match(new RegExp(this.filterText, 'i'))) || 
     (this.filterText2 && item.name.match(new RegExp(this.filterText2, 'i'))); 
    }, 

Here你可以看到這種方法的一個例子。