AngularJS - 获得过滤数据的长度

我想获取已过滤数据的长度，而不是获取实际数据的长度，我已经过滤了仅具有属性placed的数据。 my plunk demo AngularJS - 获得过滤数据的长度

结果我得到了

Total 3 Notifications 

2 quantities of V 4 Vanilla should be prepared 

3 quantities of Power cut should be prepared

结果我希望

Total 2 Notifications 

2 quantities of V 4 Vanilla should be prepared 

3 quantities of Power cut should be 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 be prepared </p> 
</div>

控制器

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

my plunk demo

来源

2016-06-11 Rohit Vinay

添加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 be prepared </p> 
    </div> 
</body>

Plunker Demo

如果您有任何doubt.Please让我know.Thanks

来源

2016-06-11 07:04:46 Muhsin

谢谢，完美的作品 –

@RohitKumarVinay很高兴帮助你 – Muhsin

你可以把这个拿到的lenght你的过滤数组。

ng-repeat="item in $data| filter:f as results"

现在你可以使用results检查其lenght或在另一个DIV与此类似。

ng-if="results.length === 0"

来源

2016-06-11 07:11:35

AngularJS - 获得过滤数据的长度

回答

相关问题