首先定义一个json文件:
然后写HTML文件:
1 <div id="box"> 2 <!--第一个下拉框--> 3 <select ng-model="a"> 4 <option value="age">按照年龄排序</option> 5 <option value="code">按照编码排序</option> 6 <option value="name">按照姓名排序</option> 7 </select> 8 <!--升序还是降序--> 9 <select ng-model="b"> 10 <option value="">升序</option> 11 <option value="-">降序</option> 12 </select> 13 <!--一个搜索框--> 14 <input type="text" placeholder="请输入要搜索的内容" ng-model="c"/> 15 </div> 16 <!--渲染的数据--> 17 <div id="wrap"> 18 <table> 19 <tr> 20 <th>编码</th> 21 <th>姓名</th> 22 <th>年龄</th> 23 </tr> 24 <tr ng-repeat="item in data|filter:c|orderBy:b+a"> 25 <td>{{item.code}}</td> 26 <td>{{item.name}}</td> 27 <td>{{item.age}}</td> 28 </tr> 29 </table> 30 </div> 31
angular:
1 <script> 2 var app = angular.module("mk",[]); 3 app.controller("test",function($scope,$http){ 4 $http.get(‘json/index.json‘).success(function(data){ 5 $scope.data = eval(data); 6 $scope.a = "code"; 7 }) 8 }) 9 </script>
在这种运用到的过滤器有filter 、orderBy
这样就完成了一个简单的排序,希望能帮到大家!!!!!!!!
时间: 2024-10-16 15:51:32