angularjs do orderBy after click the Header and not give default Header -

these headers:

<th ng-click="changesort('header1')">header1</th> <th ng-click="changesort('header2')">header2</th> <th ng-click="changesort('header3')">header3</th> 

and table body:

<tr ng-repeat="obj in myarray | orderby: sortvalue : orderbydirection"> </tr> 

my controller:

$scope.orderbyfield = 'num1'; $scope.orderbydirection = true; $scope.myarray = [     {num:1,key:x},     {num:2,key:p},     ... ]; $scope.sortvalue = function(obj) {     return obj.num; } $scope.changesort = function(field) {     if(field == $scope.orderbyfield) {         $scope.orderbydirection = !$scope.orderbydirection;     } else{         $scope.orderbydirection = false;         $scope.orderbyfield = field;     } }; 

now,my question don't want order when open page. have found if don't init $scope.orderbyfield orderby not affect default list. angular still execute orderby method.

how can prevent execute when $scope.orderbyfield undifined?

there no need use function ordering in case. order orderbyfield

<tr ng-repeat="obj in myarray | orderby: orderbyfield : orderbydirection"> 

then in controller, intialize nothing

$scope.orderbyfield = ''; 

when click on column header, change order num property:

<th ng-click="changesort('num')">header1</th> <th ng-click="changesort('num')">header2</th> <th ng-click="changesort('num')">header3</th> 

edit: if want use sort function try this.

leave repeat is. initialize orderbyfield nothing , change sort function:

$scope.orderbyfield = ''; $scope.sortvalue = function(obj) {     return obj[$scope.orderbyfield] || obj; };