Reputation: 3225
I can get the overall count of a number of articles in a JSON array using the following:
Home.html
<div ng-controller="pfcArticleCountCtrl">Number of Articles {{articlecount.length}} items</div>
Controllers.js
// Count number of total articles
pfcControllers.controller('pfcArticleCountCtrl', ['$scope', 'pfcArticles', function ($scope, pfcArticles) {
$scope.articlecount = pfcArticles.query();
}]);
Services.js
// Articles by ID
pfcServices.factory('pfcArticles', ['$resource', function ($resource) {
return $resource('https://myrestcall.net/tables/articles/:articleID', { articleID: '@id' },
{
'update': { method:'PATCH'}
}
);
}]);
But I would also like to display the number of articles by category. Here is an example JSON return:
[
{
"id": "66D5069C-DC67-46FC-8A51-1F15A94216D4",
"articletitle": "artilce1",
"articlecategoryid": 1,
"articlesummary": "article 1 summary. "
},
{
"id": "66D5069C-DC67-46FC-8A51-1F15A94216D5",
"articletitle": "artilce2",
"articlecategoryid": 2,
"articlesummary": "article 2 summary. "
},
{
"id": "66D5069C-DC67-46FC-8A51-1F15A94216D6",
"articletitle": "artilce3",
"articlecategoryid": 3,
"articlesummary": "article 3 summary. "
},
{
"id": "66D5069C-DC67-46FC-8A51-1F15A94216D7",
"articletitle": "artilce4",
"articlecategoryid": 1,
"articlesummary": "article 3 summary. "
},
]
In this instance the overall count is 4, but for Category 1, it should be 2. I want to display this on a page as follows:
Category 1 (2) Category 2 (1) Category 3 (1)
Total Articles (4)
How do I count the number of articles by category?
Upvotes: 0
Views: 2548
Reputation: 309
You could use reduce to create an object with cat id as name and count as value :
$scope.articleByCat = articles.reduce(function (prev, item) {
if ( !! prev[item.articlecategoryid]) {
//category already exist -> increment
prev[item.articlecategoryid]++;
} else {
//category does not exist -> init
prev[item.articlecategoryid] = 1;
}
return prev;
}, {});
You expose it by your scope and display it via ng-repat
<div ng-app='article' ng-controller='ArticleController'>
<ul>
<li ng-repeat='(key, value) in articleByCat'>Category {{key}} : {{value}}</li>
</ul>
</div>
A working jsfiddle
Upvotes: 2
Reputation: 4847
First sort the array var data = [ ];
(your data)
data.sort(sort);
function sort(a,b) {
if (a.articlecategoryid < b.articlecategoryid)
return -1;
if (a.articlecategoryid > b.articlecategoryid)
return 1;
return 0;
}
Then count the duplicate values
var current = null;
var cnt = 0;
for (var i = 0; i < data.length; i++) {
if (data[i].articlecategoryid != current) {
if (cnt > 0) {
document.write('Category'+current+'-->'+cnt+ ' times<br>');
}
current = data[i].articlecategoryid;
cnt = 1;
} else {
cnt++;
}
}
if (cnt > 0) {
document.write('Category'+current+'-->'+cnt+ ' times');
}
see the example in here
Upvotes: 0