ng-clickがテーブルヘッダーで機能していません

Question

こんにちは、私はAngularJSを初めて使っています。私はテーブルヘッダーをクリックしてテーブル内のデータを並べ替えるためのサンプルアプリケーションを作成しています。最初のクリックでは、昇順に並べる必要があります。 2回目のクリックで降順に並べる必要があります。 以下はcshtmlコードです。提供以下

<div ng-controller="myController"> 
<table class="table table-bordered table-striped table-hover"> 
<thead> 
<tr> 
<th ng-click="sortData('firstname')">First Name</th> 
<th>Last Name</th> 
<th>Salary</th> 
</tr> 
</thead> 
<tbody> 
<tr ng-repeat="employee in employees|orderBy:'sortColumn'"> 
<td>{{employee.firstname | lowercase}}</td> 
<td>{{employee.lastname| uppercase}}</td> 
<td>{{employee.salary |currency:"$":1}}</td> 
</tr> 
</tbody> 
</table> 
</div> 

ngのクリックが動作していないいくつかの理由モジュール

var myApp = angula 
.module("myModule", []) 
.controller("myController", function ($scope) { 
    var employee = [ 

{ firstname: "First", lastname: "Trueman", salary: "20001" }, 
{ firstname: "Second", lastname: "someone", salary: "20002" }, 
{ firstname: "Third", lastname: "apple", salary: "20003" }, 
{ firstname: "Fourth", lastname: "parrot", salary: "20004" }, 
{ firstname: "Fifth", lastname: "mat", salary: "20005" }, 
]; 
$scope.employees = employee; 
$scope.sortColumn = "firstname"; 
$scope.reverseSort = false; 
$scope.sortData = function (column) { 
$scope.reverseSort = ($scope.sortColumn == column) ? !$scope.reverseSort : false; 
$scope.sortColumn = column; 
} 
}); 

ためのスクリプトです。以前誰かが同じ問題に直面していますか？もしそうなら、これで私を助けることができます。それは、変数 がORDERBYにreverseSort変数を追加しているよう

sortColumnは、単一引用符なしで使用する必要があります。

Answer 1

が固定されるように必要な2つの事がありました。

<table class="table table-bordered table-striped table-hover"> 
<thead> 
    <tr> 
    <th ng-click="sortData('firstname')">First Name</th> 
    <th>Last Name</th> 
    <th>Salary</th> 
    </tr> 
</thead> 
<tbody> 
    <tr ng-repeat="employee in employees|orderBy: sortColumn : reverseSort"> 
    <td>{{employee.firstname | lowercase}}</td> 
    <td>{{employee.lastname| uppercase}}</td> 
    <td>{{employee.salary |currency:"$":1}}</td> 
    </tr> 
</tbody> 

私は作業plnkr hereを作成しました。