在angularjs中按复选框值排序
Sort on checkbox value in angularjs
我想用 AngularJs 对表中的一列真/假复选框进行排序(即首先显示所有空复选框,反之亦然)。
复选框绑定到模型,复选标记相应地显示,但我无法对列进行排序。是否可以以角度执行此操作?
我想这不是故意的。目的是我有 5 个复选框,其中两个被选中,然后我需要对它们进行排序,首先选中框或 viceversa
检查此链接 https://docs.angularjs.org/api/ng/filter/orderBy
这是 Angular 为此功能提供的演示
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-example103-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
</head>
<body ng-app="orderByExample">
<script>
angular.module('orderByExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.friends =
[{name:'John', phone:'555-1212', age:10},
{name:'Mary', phone:'555-9876', age:19},
{name:'Mike', phone:'555-4321', age:21},
{name:'Adam', phone:'555-5678', age:35},
{name:'Julie', phone:'555-8765', age:29}];
$scope.predicate = '-age';
}]);
</script>
<div ng-controller="ExampleController">
<pre>Sorting predicate = {{predicate}}; reverse = {{reverse}}</pre>
<hr/>
[ <a href="" ng-click="predicate=''">unsorted</a> ]
<table class="friend">
<tr>
<th><a href="" ng-click="predicate = 'name'; reverse=false">Name</a>
(<a href="" ng-click="predicate = '-name'; reverse=false">^</a>)</th>
<th><a href="" ng-click="predicate = 'phone'; reverse=!reverse">Phone Number</a></th>
<th><a href="" ng-click="predicate = 'age'; reverse=!reverse">Age</a></th>
</tr>
<tr ng-repeat="friend in friends | orderBy:predicate:reverse">
<td>{{friend.name}}</td>
<td>{{friend.phone}}</td>
<td>{{friend.age}}</td>
</tr>
</table>
</div>
</body>
</html>
相关文章:
- 基于单选按钮和复选框的数据表排序
- 我的表排序器中的列排序将覆盖表标题中的复选框
- 如何在具有分页功能的表格排序器中取消选中所有复选框
- 在javascript中对复选框值进行排序
- 如何按类、值和选中项对复选框进行排序
- 在angularjs中按复选框值排序
- 带有表格排序器的多选复选框
- 使用挖空复选框进行多重排序
- 带有复选框的排序表:内容不再可见
- jQuery DataTables按n列复选框排序
- 复选框在Slick Grid中排序不正确
- 在Knockout.js中,如何在映射后根据复选框字段对viewModel项进行排序
- 按字母顺序对输入/复选框元素进行排序
- 如何防止点击“全选”复选框影响标题和列排序
- 在排序之前,从部分复选框列表中排除项目
- 排序html表根据列表的复选框在表列
- 如何对带有复选框的html表排序
- 使用复选框对列进行排序.不;不起作用.我被卡住了
- JS表按复选框排序
- 带有标签的可排序复选框