是否可以扩展现有的“标准”过滤器(date
,number
,lowercase
等)?
在我的情况下,我需要从YYYYMMDDhhmmss格式解析日期,所以我想扩展(或覆盖)date
过滤器,而不是自己编写。
答案 0 :(得分:81)
我更喜欢实现decorator pattern,这在AngularJS中非常容易
如果我们采用@ pkozlowski.opensource示例,我们可以将其更改为:
myApp.config(['$provide', function($provide) {
$provide.decorator('dateFilter', ['$delegate', function($delegate) {
var srcFilter = $delegate;
var extendsFilter = function() {
var res = srcFilter.apply(this, arguments);
return arguments[2] ? res + arguments[2] : res;
}
return extendsFilter;
}])
}])
然后在您的视图中,您可以同时使用标准输出和扩展行为。
使用相同的过滤器
<p>Standard output : {{ now | date:'yyyyMMddhhmmss' }}</p>
<p>External behavior : {{ now | date:'yyyyMMddhhmmss': ' My suffix' }}</p>
这是一个工作小提琴,说明了这两种技巧: http://jsfiddle.net/ar8m/9dg0hLho/
答案 1 :(得分:42)
我不确定我是否正确理解您的问题,但如果您想扩展现有过滤器的功能,您可以创建一个装饰现有过滤器的新过滤器。例如:
myApp.filter('customDate', function($filter) {
var standardDateFilterFn = $filter('date');
return function(dateToFormat) {
return 'prefix ' + standardDateFilterFn(dateToFormat, 'yyyyMMddhhmmss');
};
});
然后,在您的模板中:
{{now | customDate}}
如上所述,如果您只想根据给定的格式设置日期格式,可以使用现有的日期过滤器来完成:
{{now | date:'yyyyMMddhhmmss'}}
以下是工作jsFiddle,说明了两种技术:http://jsfiddle.net/pkozlowski_opensource/zVdJd/2/
请注意,如果未指定格式,AngularJS将假定这是“中等”格式(具体格式取决于区域设置)。请查看http://docs.angularjs.org/api/ng.filter:date了解更多信息。
最后一句话:我对你问题的'解析'部分感到有些困惑。问题是过滤器用于将对象(在本例中为日期)解析为字符串而不是反之。如果您在解析表示日期的字符串(来自输入)后,您将不得不查看NgModelController#$ parsers(请查看http://docs.angularjs.org/guide/forms中的“自定义验证”部分)。