AngularJS Example:

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<div ng-app="app">
     <h2>Todo</h2>

    <div ng-controller="TodoCtrl">
        <div ng-repeat="i in items | orderBy: 'product_id' |groupBy:'product_id':'quantity'">{{i}}</div>
    </div>
</div>

CSS

.done-true {
    text-decoration: line-through;
    color: grey;
}

JavaScript

angular.module('app', [])
    .controller('TodoCtrl', function ($scope) {
    $scope.items = [{
        product_id: 1,
        quantity: 2
    }, {
        product_id: 1,
        quantity: 3
    }, {
        product_id: 2,
        quantity: 2
    }, {
        product_id: 3,
        quantity: 4
    }, {
        product_id: 2,
        quantity: 8
    }];
})
    .filter('groupBy', function () {
    return function (values, property1, property2) {
        var groupByArray = [];
        console.log("Initialize");
        angular.forEach(values, function (value, index) {
            var lengthOfGroupBy = groupByArray.length;
            if (lengthOfGroupBy > 0 && groupByArray[lengthOfGroupBy - 1][property1] == value[property1]) {
                groupByArray[lengthOfGroupBy - 1][property2] = groupByArray[lengthOfGroupBy - 1][property2] + value[property2]
            }
        });
        return groupByArray;
    }
});