angular.module("exampleApp") .filter("labelCase", function () { return function (value, reverse) { if (angular.isString(value)) { var intermediate = reverse ? value.toUpperCase() : value.toLowerCase(); return (reverse ? intermediate[].toLowerCase() : intermediate[].toUpperCase() + intermediate.substr()); } else { return value; } } }) .filter("skip", function () { return function(data,count) { if (angular.isArray(data) && angular.isNumber(count)) { if(data.length<count || count<) { return data; }else { return data.slice(count); } } else { return data; } } });
html改的部分:
<tr ng-repeat="item in products | skip: ">
结果:总共是六条数据,有使用了skip过滤器给过掉2条。
在自定义过滤器时,发现有个过滤器已经定义了,我不想重复定义,怎么办,我们还可以利用一创建的过滤器进行创建。
angular.module("exampleApp") .filter("labelCase", function () { return function (value, reverse) { if (angular.isString(value)) { var intermediate = reverse ? value.toUpperCase() : value.toLowerCase(); return (reverse ? intermediate[].toLowerCase() : intermediate[].toUpperCase() + intermediate.substr()); } else { return value; } } }) .filter("skip", function () { return function (data, count) { if (angular.isArray(data) && angular.isNumber(count)) { if (data.length < count || count < ) { return data; } else { return data.slice(count); } } else { return data; } } }) .filter("take", function ($filter) {//大家可以看到,我在工厂函数引用了AngularJs的内置服务。 return function (data, skipcount, takecount) {//大家看下我这里传了三个参数? var skipdata = $filter('skip')(data, skipcount);//这种写法大家是否迷糊了呢?函数式编程。 return $filter("limitTo")(skipdata, takecount);//limitTo是内置的过滤器。 } });
$filter('skip') 调用的是skip过滤器,因为他返回的是一个函数,所以我们能继续传参。
<tr ng-repeat="item in products | take::">
结果:
过滤器就是这样就已经完成了。是不是很简单。
您可能感兴趣的文章: