Angular: Empty Fiddle

http://angularjs.org/

HTML

<div ng-controller="MyCtrl">
  <ul ng-repeat="card in cards | orderBy:myValueFunction">
      <li>{{card.name}} {{value(card)}}</li>
    </ul>
</div>

JavaScript

var myApp = angular.module('myApp', []);

function MyCtrl($scope) {
    $scope.cards = [
        {
            name: 'card1',
            values: {
                opt1: 9,
                opt2: 12
            }
        },
        {
            name: 'card2',
            values: {
                opt1: 9,
                opt2: 11
            }
        }
    ];
    
    $scope.myValueFunction = function(card) {
        return card.values.opt1 + card.values.opt2;
    }
    
    $scope.value = function(card) {
        return card.values.opt1 + card.values.opt2;
    }
}