Cacomania: tag


Simple AngularJS sum by key view filter

Guido Krömer - 1305 days ago - Tags: ,

This little view filter for AngularJS sums up the values of a spcific field from an array of objects.

This is quite useful if you want to show the total number of something at a table footer, for example.

angular.module('caco.feed.filter', [])
    .filter('sumByKey', function() {
        return function(data, key) {
            if (typeof(data) === 'undefined' || typeof(key) === 'undefined') {
                return 0;
            var sum = 0;
            for (var i = data.length - 1; i >= 0; i--) {
                sum += parseInt(data[i][key]);
            return sum;

Here is a small fiddle which shows how the filter works:

Let me know if you liked or disliked my little posting.

Comment [16]

A simple AngularJS client side pagination module

Guido Krömer - 1488 days ago - Tags: ,

After my last tutorial, I wanted to do some more complex with AngularJS and solve my news feed problem in a similar way I solved my bookmark chaos. During this, I ran into the problem that displaying large lists, containing hundred of entries, can slow down the app significant using ng-repeat. On slow browsers like the Firefox or Opera the application hangs for some seconds during rendering the list of feed items. Since the JSON encoded and GZIP compressed list with 1.000 feed items for example is transferred quite fast, I did not want to do the pagination on the server side instead of this I wanted to paginate the list on the client. Doing the pagination on the client has the benefit that other filters could be used at the same time, too.

Client side pagination with AngularJS

read more TEST

Comment [36]

A simple RESTful AngularJS bookmark app

Guido Krömer - 1514 days ago - Tags: , ,

Welcome to the second part of my AngularJS tutorial, you can read the first part here which covers a RESTful API build with the Slim PHP micro framework. AngularJS is a JavaScript framework for building single page applications in a MVC style. Unlike the traditionally way with jQuery you do not have to add event listeners on CSS classes and select HTML elements by querying them.

AngularJS Bookmark App, list view.

read more TEST

Comment [5]