Sử dụng Angular để sắp xếp dữ liệu

Ví dụ:
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="namesCtrl">
<p>Danh sách nhân viên:</p>
<table border="1" width="100%">
<tr>
    <th ng-click="SapXep('Ten')">Tên</th>
    <th ng-click="SapXep('Tuoi')">Tuổi</th>
</tr>
<tr ng-repeat="x in NhanVien | orderBy:CotSapXep">
    <td>{{x.Ten}}</td>
    <td>{{x.Tuoi}}</td>
</tr>
</table>

</div>
<script>
angular.module('myApp', []).controller('namesCtrl', function($scope) {
    $scope.NhanVien = [
        {Ten:'Jani',Tuoi:30},
        {Ten:'Carl',Tuoi:20},
        {Ten:'Margareth',Tuoi:18},
        {Ten:'Hege',Tuoi:37},
        {Ten:'Joe',Tuoi:20}
        ];
    $scope.SapXep = function(x) {
        $scope.CotSapXep = x;
}
});
</script>
</body>
</html>

Ví dụ 2: Vừa sắp xếp tăng và giảm
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="namesCtrl">
<p>Danh sách nhân viên:</p>
<table border="1" width="100%">
<tr>
    <th ng-click="SapXep('Ten')">Tên</th>
    <th ng-click="SapXep('Tuoi')">Tuổi</th>
</tr>
<tr ng-repeat="x in NhanVien | orderBy:CotSapXep:KieuSapXep">
    <td>{{x.Ten}}</td>
    <td>{{x.Tuoi}}</td>
</tr>
</table>

</div>
<script>
angular.module('myApp', []).controller('namesCtrl', function($scope) {
    $scope.NhanVien = [
        {Ten:'Jani',Tuoi:30},
        {Ten:'Carl',Tuoi:20},
        {Ten:'Margareth',Tuoi:18},
        {Ten:'Hege',Tuoi:37},
        {Ten:'Joe',Tuoi:20}
        ];
    $scope.SapXep = function(x) {
        $scope.CotSapXep = x;
        $scope.KieuSapXep=!$scope.KieuSapXep;
    }
    ;$scope.KieuSapXep=true
});
</script>
</body>
</html>