我有像这样的json数据
[{name:" abc",count:"(10)",{name:" xyz",count:"(20 )"},{name:" pqr",count:20}]
我使用Angular datatables绑定此数据,现在我想对count
列以下列方式
更新
下降时应该是
计数
(20)
20
(10)
在升序中它应该是
计数
(10)
20
(20)
我尝试使用我的表上定义的自定义过滤器实现相同的目的
$scope.countFilter = function(item){
return parseInt(item.count.replace('(', item));
};
但它似乎没有给我想要的结果。
我的表格如下
<table>
<thead>
<tr>
<th>Name</th>
<th>Count </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in items |orderBy:'countFilter'">
<td>{{item.name}} </td>
<td>{{item.count}} </td>
</tr>
</tbody>
<table>
答案 0 :(得分:2)
您应该创建一个自定义过滤器来对它们进行排序,而不是传递谓词函数(它将根据返回值简单地包含或排除数组中的项。
这样的东西会起作用..它使用array.prototype.sort
和自定义排序函数。
angular.module('myApp', [])
.filter( 'bracketSort', function() {
return function ( inputArray ) {
// Look for brackets
var bracketRegex = /\(([0-9]+)\)/;
return inputArray.sort( function (a, b) {
var aBrackets = bracketRegex.exec(a);
var bBrackets = bracketRegex.exec(b);
// brackets mean a higher value
if(aBrackets && !bBrackets)
return 1;
else if (bBrackets && !aBrackets)
return -1;
else if (aBrackets)
return aBrackets[1] - bBrackets[1];
else
return a - b;
});
};
});
你可以像这样使用它:
<tr ng-repeat="item in items | bracketSort">
答案 1 :(得分:1)
我有一个有效的解决方案:
喜欢@Ed Hinchliffe的解决方案 -
<tr ng-repeat="item in items | bracketSort:<true or false>">
和过滤器 -
.filter('bracketSort', function() {
return function ( inputArray, descending ) {
return inputArray.sort( function (a, b) {
//replace pattern "(number)" with "-number"
aVal = a.count.toString().replace(/\((\d+)\)/, "-$1");
bVal = b.count.toString().replace(/\((\d+)\)/, "-$1");
return descending ? bVal- aVal : aVal - bVal;
});
};
})
<强>更新强>
现在我已经更好地理解了这个问题,here是一个适用于datatables
的解决方案。
jQuery.fn.dataTableExt.oSort['brackets_nums-asc'] = function (x, y) {
xVal = x.toString().replace(/\((\d+)\)/, "-$1");
yVal = y.toString().replace(/\((\d+)\)/, "-$1");
return xVal - yVal;
}
jQuery.fn.dataTableExt.oSort['brackets_nums-desc'] = function (x, y) {
xVal = x.toString().replace(/\((\d+)\)/, "-$1");
yVal = y.toString().replace(/\((\d+)\)/, "-$1");
return yVal - xVal;
}
$(document).ready(function () {
$('#example').dataTable({
"sPaginationType": "full_numbers",
"bJQueryUI": true,
"bFilter": true,
"bRetrieve": true,
"bStateSave": true,
"aoColumns": [{}, {
"sType": "brackets_nums"
}]
});
})
我删除了Angular过滤器,因为它没有必要,所以基本上这个解决方案中唯一的Angular是使用ng-repeat
。
但它的确有效!