时间:2021-05-28
本文实例为大家分享了angular过滤器排序的具体代码,供大家参考,具体内容如下
首先定义一个json文件:
然后写HTML文件:
<div id="box"> <!--第一个下拉框--> <select ng-model="a"> <option value="age">按照年龄排序</option> <option value="code">按照编码排序</option> <option value="name">按照姓名排序</option> </select> <!--升序还是降序--> <select ng-model="b"> <option value="">升序</option> <option value="-">降序</option> </select> <!--一个搜索框--> <input type="text" placeholder="请输入要搜索的内容" ng-model="c"/> </div> <!--渲染的数据--> <div id="wrap"> <table> <tr> <th>编码</th> <th>姓名</th> <th>年龄</th> </tr> <tr ng-repeat="item in data|filter:c|orderBy:b+a"> <td>{{item.code}}</td> <td>{{item.name}}</td> <td>{{item.age}}</td> </tr> </table> </div>angular:
<script> var app = angular.module("mk",[]); app.controller("test",function($scope,$http){ $http.get('json/index.json').success(function(data){ $scope.data = eval(data); $scope.a = "code"; }) }) </script>在这种运用到的过滤器有filter 、orderBy
这样就完成了一个简单的排序,希望能帮到大家!
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了Angularjs过滤器实现动态搜索与排序功能。分享给大家供大家参考,具体如下:利用angularjs实现动态的插入以及利用过滤器进行数据的搜索以
本文实例讲述了Angular实现的内置过滤器orderBy排序与模糊查询功能。分享给大家供大家参考,具体如下:先来看看运行效果:具体代码如下:www.jb51.
本文实例为大家分享了Angularjs过滤器完成排序的具体代码,供大家参考,具体内容如下angular.module('myApp',[]).service('
mvc4中的过滤器过滤器(Filter)把附加逻辑注入到MVC框架的请求处理。实现了交叉关注。交叉关注:用于整个应用程序,又不适合放在某个局部位置的功能。过滤器
一过滤器写法{{message|Filter}}二Vue自带的过滤器:capitalize功能:首字母大写Vue自带的过滤器{{message|capitali