JSFiddle - React, Tailwind, and code Playground

HTML

<table>
  <thead>
    <tr>
      <th ng-click="sortData('name')" ng-class="getSortClass('name')">
        Name
      </th>
      <th ng-click="sortData('dob')" ng-class="getSortClass('dob')">
        Date of birth
      </th>
      <th ng-click="sortData('gender')" ng-class="getSortClass('gender')">
        Gender
      </th>
      <th ng-click="sortData('salary')" ng-class="getSortClass('salary')">
        Salary(Rupees)
      </th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="employee in employees | orderBy:sortColumn:reverseSort">
      <td>{{employee.name}}</td>
      <td>{{employee.dob | date:"dd/MM/yy"}}</td>
      <td>{{employee.gender}}</td>
      <td>{{employee.salary}}</td>
    </tr>
  </tbody>
</table>

CSS

table,
tr,
td {
  border: 1px solid;
  padding: 10px;
}

.arrow-up {
  width: 100px;
  height: 10px;
  border-right: 5px transparent;
  border-left: 5px transparent;
  border-bottom-color: 10px solid black;
  display: inline-block;
}

.arrow-down {
  width: 0;
  height: 0;
  border-right: 5px transparent;
  border-left: 5px transparent;
  border-bottom-color: 10px solid black;
  display: inline-block;
}

JavaScript

var app = angular
  .module("myModule", [])
  .controller("myController", function($scope) {

    var employees = [{
      name: "Sindhu",
      dob: new Date("november,20,1995"),
      gender: "female",
      salary: "57300.00"
    }, {
      name: "Yashu",
      dob: new Date("august,25,1997"),
      gender: "female",
      salary: "47653.0000"
    }, {
      name: "sneha",
      dob: new Date("july,30,1999"),
      gender: "female",
      salary: "43300.00"
    }];
    $scope.employees = employees;
    $scope.sortColumn = "name";
    $scope.reverseSort = false;

    $scope.sortData = function(column) {
      $scope.reverseSort = ($scope.sortColumn == column) ? !$scope.reverseSort : false;
      $scope.sortColumn = column;
    }
    $scope.getSortClass = function(column) {
      if ($scope.sortColumn == column) {
        return $scope.reverseSort ? 'arrow-down' : 'arrow-up';
      }

      return '';
    }
  });