什么是聚合物0.9“过滤器”的最佳方式？

Question

在0.5，有可能增加一个JS-功能，如：

PolymerExpressions.prototype.timeofdate = function(input) { 
if(input) { 
    return input.substring(11,16) 
} 

（提取小时：分钟从 “MongoDB的时间戳” 等2014-10-04T12：34：56 + 02：00）

并与管道变量使用，如：

{{starts | timeofdate}} 

当我试图升级上面0.9的代码，我不得不创建这个元素来代替：

<script> 
    Polymer({ 
    is: 'x-substr', 
    properties: { 
     start: Number, 
     end: Number, 
    }, 
    attached: function() { 
     this.innerHTML = this.innerHTML.substring(this.start, this.end); 
    } 
    }); 
</script> 

而且使用这样的：

<x-substr start="11" end="16">{{starts}}</x-substr> 

（使用“附加”的回调，而不是“准备”，如果你要使用任何数据绑定使用此元素）

这是“正道”在Polymer 0.9+中做类似上面的过滤功能？

Answer 1

在0.5中最接近过滤器行为的是computed bindings 0.9+。

为了您的例子，这会是这样的：

<dom-module id="..."> 
    <template> 
    ... 
    <span>{{timeofdate(starts)}}</span> 
    ... 
    </template> 
<dom-module> 

Polymer({ 
    ... 
    timeofdate: function (input) { 
    return input.substring(11,16); 
    } 
    ... 
}); 

如果您需要这一次在一个以上的地方，你也可以让它computed property代替。

<dom-module id="..."> 
    <template> 
    ... 
    <span>{{starttime}}</span> 
    ... 
    </template> 
<dom-module> 

Polymer({ 
    ... 
    properties: { 
    starts: String, 
    starttime: { 
     type: String, 
     computed: 'timeofdate(starts)' 
    } 
    }, 
    timeofdate: function (input) { 
    return input.substring(11,16); 
    } 
    ... 
});