如何使用angularjs按自定義字段排序？

我想創建一個html表來使用angular js來顯示用戶結果，它有三個狀態：「Pass」，「In Process」和「Fail」。這裏是我的代碼：如何使用angularjs按自定義字段排序？

angular.module('myExam', []) 
    .controller('myCtrl', ['$scope', function($scope) { 
     $scope.Exam_result = 
      [{name:'John', result:'Fail', age:10}, 
      {name:'Mary', result:'Pass', age:19}, 
      {name:'Mike', result:'In Process', age:21}, 
      {name:'Adam', result:'In Process', age:35}, 
      {name:'Julie',result:'Fail', age:29}]; 
     $scope.predicate = 'age'; 
     $scope.reverse = true; 
     $scope.order = function(predicate) { 
     $scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false; 
     $scope.predicate = predicate; 
     }; 
    }]);

<body ng-app="myExam"> 
<div ng-controller="myCtrl"> 

    <table class="Exam" border="1"> 
    <tr> 
     <th> 
     <a href="" ng-click="order('name')">Name</a> 
     <span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span> 
     </th> 
     <th> 
     <a href="" ng-click="order('result')">Phone Number</a> 
     <span class="sortorder" ng-show="predicate === 'phone'" ng-class="{reverse:reverse}"></span> 
     </th> 
     <th> 
     <a href="" ng-click="order('age')">Age</a> 
     <span class="sortorder" ng-show="predicate === 'age'" ng-class="{reverse:reverse}"></span> 
     </th> 
    </tr> 
    <tr ng-repeat="Exam in Exam_result | orderBy:predicate:reverse"> 
     <td>{{Exam.name}}</td> 
     <td>{{Exam.result}}</td> 
     <td>{{Exam.age}}</td> 
    </tr> 
    </table> 
    <hr> 
</body>

我希望用戶可以通過點擊狀態和像這樣排序，的字母來代替：一是「合格」，第二個「失敗」，第三「在過程

這裏是我的鏈接：

Fiddle

來源

2017-10-19 francoleung

有你的提琴 – Sajeetharan

感謝，http://jsfiddle.net/v9334apr/6/ – francoleung

無場狀態你是什麼意思的感謝？仍然我看到沒有狀態 – Sajeetharan