How to sort time in angularjs

Updated my original answer to fit your specific needs :

since your timeslots are strings you will need to perform some type of sorting yourself. orderBy can sort your array depending on a property of the object that your array contains, since we are working with strings this will not do the trick and will need some love before we can achieve what you want. What I am doing here is doing a manual sort depending on the index of what I know is the correct order, and adding a property to the objects in my array so that I can then use the orderBy filter with predicate 'timeslotOrder' wich I have added myself and which is a Number. Now orderBy can arrange them from low to high or if you want reverse you can do '-timeslotOrder' as a predicate

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


angular.module('myApp').controller("MyCtrl",function($scope) {
    $scope.timeSlots = [
        "12-1PM",
        "1-2PM",
        "2-3PM",
        "3-4PM",
        "4-5PM",
        "6-7PM",
        "8-9PM "
  ];

    $scope.fetchedItems = [
        {name:"test", quantity:5, timeslot: "12-1PM"},
        {name:"test2", quantity:5, timeslot: "1-2PM"}, 
        {name:"test", quantity:5, timeslot: "3-4PM"},
        {name:"test", quantity:5, timeslot: "2-3PM"}
    ]; 

    $scope.sortFunction = function() {
        var sortedArray = [];
        for(var i = 0; i < $scope.fetchedItems.length; i++) {
        var index = $scope.timeSlots.indexOf($scope.fetchedItems[i].timeslot);
        $scope.fetchedItems[i].timeslotOrder = index;    
        };
    }
    $scope.sortFunction();


})

and then in html:

<div ng-controller="MyCtrl">
    <ul ng-repeat="item in fetchedItems | orderBy: 'timeslotOrder'">
        <li>{{item.timeslot}}</li>
    </ul>
</div>

working jsfiddle: Updated Fiddle

add this in controller

    $scope.predicate = 'timeSlot';
    $scope.reverse = false;
    $scope.order = function(predicate) {
        $scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false;
        $scope.predicate = predicate;
    };

and change your ng-repeat like this

    <tr ng-repeat="item in itemList | orderBy:predicate:reverse">

hope it will work.

Try this:

1)

<td><a href="" ng-click="predicate = 'timeSlot'; reverse=!reverse">Time Slot<span ng-show="predicate == 'timeSlot'"></a></td>

OR

2) HTML :

<a ng-click="sortBy('timeSlot')" href="" style="text-decoration: none;"> Time Slot</a>

Script :

 $scope.sortBy = function(property) {

        $scope.predicate = property;
        $scope.reverse = !$scope.reverse;
   }