使用javascript对表的所有列进行排序的通用函数

使用javascript对表的所有列进行排序的通用函数,javascript,html,angularjs,sorting,Javascript,Html,Angularjs,Sorting,我的控制器中有以下对象数组 $scope.records = [ { "fName" : "Alfreds", "lName" : "Berglunds", "country" : "Germany", "age":21 }, { "fName" : "Berglunds", "lName" : "Alfreds", "country" : "Sweden", "age"

我的控制器中有以下对象数组

$scope.records = [
    {
      "fName" : "Alfreds",
      "lName" : "Berglunds",
      "country" : "Germany",
      "age":21
    },
    {   
      "fName" : "Berglunds",
      "lName" : "Alfreds",
      "country" : "Sweden",
      "age":22
    },
    {      
      "fName" : "Centro",
      "lName" : "Ernst",
      "country" : "Mexico",
      "age":23
    },
    {      
      "fName" : "Ernst",
      "lName" : "Centro",
      "country" : "Austria",
      "age":24
    }
  ]
我正在使用上面的数组填充视图中的一个表

<table ng-controller="myCtrl" border="1">
  <th ng-click="sortByFirstName()">First Nmae</th>
  <th ng-click="sortByLastName()">Last Name</th>
  <th ng-click="sortByCountry()">Country</th>
  <th ng-click="sortByAge()">Age</th>

  <tr ng-repeat="x in records">
    <td>{{x.fName}}</td>
    <td>{{x.lName}}</td>
    <td>{{x.country}}</td>
    <td>{{x.age}}</td>
  </tr>
</table>

第一个Nmae
姓
国家
年龄
{{x.fName}
{{x.lName}
{{x.country}
{x.age}

单击每个列标题时,我需要按升序对记录进行排序,再次单击会翻转排序顺序(降序)。现在我使用不同的函数对它们进行排序。有人能提出更好的方法来实现同样的目标吗?类似于使用泛型排序函数的东西使用这个泛型排序函数并将属性名传递给它

var sortBy = ( prop ) => $scope.records.sort(  function( a, b ){
   return typeof a == "number" ? ( a[ prop ] - b[ prop ] ) : a[ prop ].localeCompare( b[ prop ] );
});
比如说

sortBy ( "fName" );

通过将
排序作为参数传递给函数,可以使用angularjs$过滤器生成
通用函数

演示
var-app=angular.module('testApp',[])
app.controller('myCtrl',函数($scope,$filter){
$scope.sortBy=函数(sortBy){
$scope.records=$filter('orderBy')($scope.records,sortBy);
}
$scope.records=[
{
“fName”:“阿尔弗雷德”,
“lName”:“Berglunds”,
“国家”:“德国”,
“年龄”:21
},
{   
“fName”:“Berglunds”,
“lName”:“阿尔弗雷德”,
“国家”:“瑞典”,
“年龄”:22
},
{      
“fName”:“Centro”,
“lName”:“Ernst”,
“国家”:“墨西哥”,
“年龄”:23
},
{      
“fName”:“Ernst”,
“lName”:“Centro”,
“国家”:“奥地利”,
“年龄”:24
}
];
});

第一个Nmae
姓
国家
年龄
{{x.fName}
{{x.lName}
{{x.country}
{x.age}

标记无效
不允许作为
@Sajeetharan的直接子级。我不知道angularjs,因此只发布普通js解决方案。即使
th
表的直接后代,您的解决方案仍然有效。