Q:

angularjs cart directive ng-repeat set total in the template

.directive('checkout',['Cart', function(Cart) {
        return {
            restrict: 'A',
            template:   '<div data-ng-repeat="item in items">' +
            '<div class="clearfix item-box">'+
            '<div class="col-md-2 text-left item-pic"><img class="img-responsive img-rounded" alt="{{item.title}}" data-ng-src="/public/upload/{{item.pic}}"></div>'+
            '<div class="col-md-2 text-left item-quantity">{{item.quantity}}</div>'+
            '<div class="col-md-4 text-left item-title">{{item.title}}</div>'+
            '<div class="col-md-4 text-right item-subtot">{{item.price * item.quantity}}</div>'+
            '</div>'+
            '</div>'+
            '<div class="text-right">Tot: {{tot}}</div>',
            controller: function($scope,$element) {
                $scope.items = Cart.get();
                $scope.tot = _.reduce( $scope.items, function(sum, item) {
                    return sum + (item.price * item.quantity);
                },0);
            }
        };
    }]);

Is there a way to do sum directly in the template 
or a better way ?

A:

Like I mentioned in my comment, you can use ng-init.  
Before you do the ng-repeat you would need to add an ng-init="tot=0".  Then within each ng-repeat you would need to add ng-init=$parent.total = $parent.total + (item.price * item.quantity).
Here is a Demo

