<tr ng-repeat="p in products | skip : 2"> <!-- 使用自定义过滤器 --> <td>{{p.name | labelCase}}</td> <td>{{p.category | labelCase : true}}</td> <td>{{p.expiry}}</td> <td>{{p.price | number : 2}}</td> </tr>
移除前两项Apples和Bananas，然后显示
3.在已有的过滤器上搭建新的过滤器
在createFilter中添加take过滤器返回，将skip和limitTo两个过滤器方法综合起来
angular.module("exampleApp") .filter("labelCase", function () { return function (value, reverse) { if (angular.isString(value)) { var inter = reverse ? value.toUpperCase() : value.toLowerCase(); return (reverse ? inter[0].toLowerCase() : inter[0].toUpperCase()) + inter.substr(1); } else { return value; } } }) .filter("skip", function () { return function (value, count) { if (angular.isArray(value) && angular.isNumber(count)){ if (count > value.length || count < 0) { return value; } else { // 跳过数组前两项 return value.slice(count); } } else { return value; } } }) // 在已有过滤器的基础上建立新的过滤器 // 将上述的skip和limit两个过滤器合并 .filter("take", function ($filter) { return function (data, skipCount, limitCount) { // 先跳过数组的前skipCount项 var skipData = $filter("skip")(data, skipCount); // 接着只取limitCount行 return $filter("limitTo")(skipData, limitCount); } })
在视图中使用：
<tr ng-repeat="p in products | take : 2 : 5"> <!-- 使用自定义过滤器 --> <td>{{p.name | labelCase}}</td> <td>{{p.category | labelCase : true}}</td> <td>{{p.expiry}}</td> <td>{{p.price | number : 2}}</td> </tr>
先移除两项，然后值取5条数据
