1 <!DOCTYPE html>
2 <html lang="zh_CN">
3 <head>
4 <meta charset="UTF-8">
5 <title>Angular基础-自定义过滤器</title>
6 </head>
7 <body>
8 <div ng-app="myApp">
9 <div ng-controller="myCtrl">
10 <h2>ng-repeat 求和</h2>
11 <table border="1" width="400">
12 <th>
13 <td>姓名</td>
14 <td>年龄</td>
15 <td>身高</td>
16 </th>
17 <tr ng-repeat="item in items">
18 <td>{{$index+1}}</td>
19 <td>{{item.name}}</td>
20 <td>{{item.age}}</td>
21 <td>{{item.stature}}</td>
22 </tr>
23 <tr>
24 <td>合计</td>
25 <td></td>
26 <td ng-bind="items | sumAge:items:'age'"></td>
27 <td></td>
28 </tr>
29 </table>
30 </div>
31
32 </div>
33 <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
34 <script type="application/javascript">
35 var myApp=angular.module('myApp',['myApp.filter']);
36 var appFilter=angular.module('myApp.filter',[]);
37 //自定义过滤器
38 myApp.filter('sumAge',function(){
39 //根据第一个参数,第二个参数求和
40 return function(input,n1,n2){
41 console.log("输入值 : "+input);
42 console.log("第一个参数: "+angular.toJson(n1));
43 console.log("第二个参数 :"+n2);
44 var sum=0;
45 angular.forEach(input, function (item) {
46 sum += item.age;
47 });
48 return sum;
49 }
50 })
51
52 </script>
53 <script>
54 myApp.controller('myCtrl', ['$scope', function ($scope) {
55 $scope.items = [
56 {
57 name: '鲁迅',
58 age: 27,
59 stature: 165
60 },
61 {
62 name: '胡适',
63 age: 25,
64 stature: 170
65 },
66 {
67 name: '契诃夫',
68 age: 27,
69 stature: 175
70 },
71 {
72 name: '巴尔扎克',
73 age: 29,
74 stature: 165
75 }];
76 }]);
77 </script>
78 </body>
79 </html>
