2015-03-01 4 views
1

У меня есть JSON данные, как эточисла фильтров со скобками в угловых JS

[{имя: "ABC", рассчитывать: "(10)", {наименование: "XYZ", рассчитывать: "(20) "}, {имя:" PQR», посчитайте: 20}]

Я связываю эти данные с помощью Angular datatables и теперь я хочу, чтобы отсортировать столбец count

следующим образом

UPDATE

В нисходящей это должно быть, как

Количество

(20)

(10)

В восходящей она должна быть, как

Количество

(10)

(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> 

ответ

1

У меня есть решение, которое работает:

Как и в @Ed Хинчлифф-х решение-

<tr ng-repeat="item in items | bracketSort:<true or false>"> 

и Обновление filter-

.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" 
    }] 
    }); 
}) 

Я удалил Угловой фильтр, потому что это не нужно, поэтому в основном только Угловой, что в этом решении является использованием ng-repeat. Но это работает!

+0

Привет. это хорошее решение. Я попытался использовать его. Это дает мне (10), (20), 20 в восходящем :(... вы пробовали его в фактическом datatable. Посмотрите этот пример [http://l-lin.github.io/angular-datatables/#/ angelWay]. Вы можете привязать данные, как это делается здесь, и проверить. –

+0

Как вы использовали по возрастанию? – yarons

+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"> 
+0

Hi. Я попытался использовать фильтр, предложенный вами. Однако это дает мне (10), (20), 20 в восходящем и нисходящем его 20, (20), (10). –

+0

Так что немного измените функцию фильтра? :) –

+0

Тогда вы почти там ... в коде @Ed Hinchliffe просто замените 'return aBrackets [1] - bBrackets [1];' с 'return bBrackets [1] - aBrackets [1];' – yarons

Смежные вопросы