2016-02-22 3 views
0

Я использую angularjs, чтобы перечислить, фильтровать и отсортировать список моих элементов. Мне удалось группа и фильтр, но не смогли получить сумму количества отдельного продукта. я не мог получить количество элементов внутри элемента группы и не смог получить сумму количества сгруппированного элемента. мой fiddleПолучение суммы количества в angularjs

Выход я

Paneer Tikka - 13 
Name: Paneer Tikka- PRICE: 125 - QTY: 1 

Falooda - 9 
Name: Falooda- PRICE: 85 - QTY: 2 
Name: Falooda- PRICE: 85 - QTY: 1 

Выход мне нужно

Paneer Tikka - 1 
Name: Paneer Tikka- PRICE: 125 - QTY: 1 

Falooda - 3 
Name: Falooda- PRICE: 85 - QTY: 2 
Name: Falooda- PRICE: 85 - QTY: 1 

HTML

<div ng-app ng-controller="Main"> 
<div ng-repeat="list in itemsToFilter() | filter:filterNames"> 
    <b>{{list.name}} - {{(list.name.length*1)+(list.qty*1)}}</b> 
    <li ng-repeat="item in itemsToFilter() | filter: {name: list.name}">NAME: {{item.name}}- PRICE: {{item.price}} - QTY: {{item.qty}}</li>   
</div> 
</div> 

Контроллер

function Main($scope) { 
$scope.list = { 
"_id": "56c4758af801160e00d176e0", 
"orderfood": [ 
{ 
"_id": "569d84f04834c10e003dff36", 
"qty": "1", 
"confirm": "placed", 
"price": 125, 
"name": "Paneer Tikka" 
}, 
{ 
"_id": "569d869fff1fe20e00f8ba9b", 
"qty": "2", 
"confirm": "placed", 
"price": 85, 
"name": "Falooda" 
}, 
{ 
"_id": "569d869fff1fe20e00f8ba9b", 
"qty": "1", 
"confirm": "placed", 
"price": 85, 
"name": "Falooda" 
} 
], 
"title": "Status", 
"created": "2016-02-17T13:28:42.226Z" 
} 

    var indexedTeams = []; 

    $scope.itemsToFilter = function() { 
     indexedTeams = []; 
     return $scope.list.orderfood; 
    } 

    $scope.filterNames = function(item) { 
     var nameIsNew = indexedTeams.indexOf(item.name) == -1; 
     if (nameIsNew) { 
      indexedTeams.push(item.name); 
     } 

     return nameIsNew; 
    } 
} 

ответ

1

list.name.length*1 в вашем HTML просто подсчитывает символы в name добавляет qty к нему. Вы можете изменить HTML следующим образом, используя groupBy (требуется angular-filter, как указано @andreiho).

<div ng-app ng-controller="Main"> 
<div ng-repeat="(key,value) in itemsToFilter() | groupBy: 'name'"> 
    <b>{{ key }} - {{ getSum(value) }}</b> 
    <li ng-repeat="item in value">NAME: {{ item.name }}- PRICE: {{ item.price }} - QTY: {{ item.qty }}</li>   
</div> 
</div> 

Затем добавить функцию, чтобы получить сумму в контроллере

$scope.getSum = function(val) { 
    var sum = 0; 
    for (var i = 0; i < val.length; i++) { // iterate and get sum 
    sum += parseInt(val[i].qty); 
    } 
    return sum; 
} 

Похоже angular-filter требует угловой версии выше 1.1.1, которая была в вашем Fiddle.

Здесь модифицируется Fiddle - http://jsfiddle.net/ranru/gmLjtxub/1/

+0

Параметр 'groupBy' фильтр не доступен из коробки. Вам нужно будет включить его из [углового фильтра] (https://github.com/a8m/angular-filter#groupby), чтобы заставить его работать. – andreiho

+0

Спасибо @andreiho. Добавили, что детали – kubuntu

+0

Вместо 'falooda - 3' он приходит как' falooda - 021'. updated [plunk] (https://plnkr.co/edit/Dk1CZHkXBIZwLUdi5I3J?p=preview) – Sunil

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