angular filters - AngularJS - get Length of filtered data -
i trying length of filtered data, instead length of actual data, have filtered data has attribute placed
. my plunk demo
result got
total 3 notifications 2 quantities of v 4 vanilla should prepared 3 quantities of power cut should prepared
result expect
total 2 notifications 2 quantities of v 4 vanilla should prepared 3 quantities of power cut should prepared
html
<p class="ordercounter">total {{getorderfoods(reduce).length }} notifications</p> <div ng-repeat="(key,data) in getorderfoods() | filter: {confirm: 'placed'} | groupby:'name'"> <p><span>{{reduce(data)}}</span> quantities of <span>{{key}}</span> should prepared </p> </div>
controller
$scope.getorderfoods = function() { var orderfood = []; $scope.reduce= function(data){ return data.reduce(function(previousvalue, currentvalue, currentindex, array) { return previousvalue + parseint(currentvalue.qty); }, 0); } angular.foreach($scope.orders, function(order) { angular.foreach(order.orderfood, function(orderfoo) { if (orderfood.indexof(orderfoo) == -1) { orderfood.push(orderfoo); } }) }); return orderfood; }
json
$scope.orders = [{ "_id": "56e3bff0e9932ca6425e6f65", "orderfood": [ { "qty": "2", "confirm": "placed", "name": "v 4 vanilla" } ], "name": "rohit", "created": "2016-03-12t07:06:24.424z" }, { "_id": "56e3bd5bc3791b973c048804", "user": null, "__v": 10, "orderfood": [ { "qty": "1", "confirm": "cancelled", "name": "v 4 vanilla" }, { "qty": "3", "confirm": "placed", "name": "power cut" } ], "name": "rohit", "created": "2016-03-12t06:55:23.244z" }];
add directive
finding length of filtered data
directive
app.filter('numkeys', function() { return function(json) { var keys = object.keys(json) return keys.length; } });
html
<body ng-controller="mainctrl"> <p class="ordercounter">total {{filtered | numkeys}} notifications</p> <div ng-repeat="(key,data) in filtered =(getorderfoods() | filter: {confirm: 'placed'} | groupby:'name')"> <p><span>{{reduce(data)}}</span> quantities of <span>{{key}}</span> should prepared </p> </div> </body>
if have doubt.please let me know.thanks
Comments
Post a Comment