Get place in table of icon using ng-click

I have a table that’s generated using ng-repeat with some columns headers. On the column headers, I want to columns to be sorted. I included a font-awesome sort icon next to their text and when it’s clicked, I call an ng-click with ng-click="sortColumn()". I’m calling this for every column header.

How do I know which column header got clicked on? Right now it fires for each header column.

How do pass the current column in using ng-click?

I tried to pass in this, but it returns the $scope object.

Here’s what I have so far:

HTML:

<table class="table">
    <thead>
        <tr>
            <td><b>Product </b><i class="fa fa-sort" ng-click="vm.sortColumn(this)"></i></td>
            <td><b>Code </b><i class="fa fa-sort" ng-click="vm.sortColumn(this)"></i></td>
            <td><B>Available </b><i class="fa fa-sort" ng-click="vm.sortColumn(this)"></i></td>
            <td><B>Price </b><i class="fa fa-sort" ng-click="vm.sortColumn(this)"></i></td>
        </tr>
    </thead>
    <tbody>
        {{ vm.noProducts }}
        <tr ng-repeat="product in vm.products">
            <td>{{ product.productName}}</td>
            <td>{{ product.productCode }}</td>
            <td>{{ product.releaseDate | date }}</td>
            <td>{{ product.price | currency }}</td>
        </tr>
    </tbody>
</table>

Javascript:

vm.sortColumn = function (obj) {
    console.log(obj);
}

Source: AngularJS