JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app ng-controller="ArrayController">
        <table>
            <th ng-repeat="header in headers">
                <a ng-click="columnSort.sortColumn=headers[$index];columnSort.reverse=!columnSort.reverse">{{ headers[$index] }}</a>
            </th>
            <tr ng-repeat="arr in records | orderBy:columnSort.sortColumn:columnSort.reverse">
                <td ng-repeat="val in arr" ng-bind-html-unsafe="arr[headers[$index]]"></td>
            </tr>
        </table>
        sortColumn: {{columnSort.sortColumn}}<br/>
        reverse: {{columnSort.reverse}}
    </div>

JavaScript

function ArrayController($scope) {
    $scope.headers = ['col1', 'col2'];
    $scope.records = [{col1: 'a1', col2: 'd1'}, {col1: 'c2', col2: 'b2'}, {col1: 'b3', col2: 'c3'}, {col1: 'd4', col2: 'a4'}];

    $scope.columnSort = { sortColumn: 'col1', reverse: false };    
}