angularjs - 如何在angularjs onclick中订购项目

Question

我有很多来自数据库的记录。想要根据记录的优先级执行排序，反之亦然。我的优先级是 ["H", "M", "L", "NO GO"]。想要显示基于优先点击按钮的记录，反之亦然意味着如果我第一次点击需要显示 H-M-L-NOGO 并且切换点击应该显示 NO GO-L-M-H。在优先级列上排序时，它的表现并不完美。我的 script.js 是

$scope.filterPriority = function () {
        if(toggled) {
            $scope.peoples.sort(function (a, b) {
                return (priorityArray[a.priority] || Infinity ) - (priorityArray[b.priority] || Infinity);
            });
            $scope.sortBy = 'priority';
            $scope.sortDescending = !$scope.sortDescending;
        } else {
            $scope.peoples.sort(function (a, b) {
                return (priorityArray[b.priority] || Infinity ) - (priorityArray[a.priority] || Infinity);
            });
            $scope.sortBy = 'priority';
            $scope.sortDescending = !$scope.sortDescending;
        }   
        toggled = !toggled;
    };
    /* sorting for remaining columns */
    $scope.sortBy = 'name';
    $scope.sortDescending = false;

    $scope.sort = function(column) {
        if ($scope.sortBy === column) {
            $scope.sortDescending = !$scope.sortDescending;
        } else {
            $scope.sortBy = column;
            $scope.sortDescending = false;
        }
    }

我在 plunker url 中的方法是 https://plnkr.co/edit/HPGnCIRNSdCFU6nI1eO2?p=preview

Answer 1

首先，ng-repeat 是“p in peoples” 而不是“peoples in p”。如下所示更改您的 priorityArray。使用下面的代码，完美运行:

angular.module('app',[]).controller('mainCtrl', function($scope){
$scope.peoples = [
            { 
               'priority': 'H'},
            {  
               'priority': 'M'},
            { 
               'priority': 'L'},
            { 
               'priority': 'NO GO'},
           {
               'priority': 'H'},
           {
               'priority': 'M'
            },
];

var priorityArray = { 'H': 1, 'M': 2, 'L': 3, 'NO GO': 4}; 
 
var toggled = false;

$scope.filterPriority = function () {
  if(toggled){
    $scope.peoples.sort(function (a, b) {
       return (priorityArray[a.priority] || Infinity ) - (priorityArray[b.priority] || Infinity);
    });
   }else{
     $scope.peoples.sort(function (a, b) {
       return (priorityArray[b.priority] || Infinity ) - (priorityArray[a.priority] || Infinity);
    });
   }   
  toggled = !toggled;
  };
        
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app' ng-controller='mainCtrl'>
   <table>
    <tr>
      <th><a ng-click="filterPriority()">priority</a></th>
      <tr ng-repeat="p in peoples"><td>{{p.priority}}</td></tr>
   </table>
    
</div>