есть ли функция сортировки внутри фигурных скобок с колонкой

Question

У меня есть код, в котором я хотел бы реализовать сортировку (по возрастанию и по убыванию), щелкнув по заголовку

{{гет (COL)}}

{{гет (COL)}}

я ожидаю сортировки для таблицы

Answer 1

Чтобы получить больше ответов на ваш вопрос, лучше всего поделиться тем, что вы уже пробовали ... но это то, что вы ищете:

• каждый заголовок столбца вызывает функцию sortByкоторый сортирует по этому столбцу, по умолчанию это делается в порядке возрастания, а порядок сортировки меняется на нисходящий (потому что нам нужно было переключать порядок после каждого клика)
• функция sortBy выполняет сортировку и обновляетВ результате пользовательский интерфейс

работает фрагмент кода ниже:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.dataset = [{
      name: 'ff',
      age: '12'
    }, {
      name: 'gg',
      age: '22'
    }, {
      name: 'jj',
      age: '34'
    }, {
      name: 'dd',
      age: '64'
    }, {
      name: 'hh',
      age: '3'
    },
    {
      name: 'ff',
      age: '32'
    }, {
      name: 'bb',
      age: '54'
    }, {
      name: 'aa',
      age: '87'
    }, {
      name: 'ii',
      age: '18'
    }, {
      name: 'cc',
      age: '69'
    }
  ];
  $scope.nameSort = 'asc';
  $scope.ageSort = 'asc';

  $scope.sortBy = function(passedTitle) {

    if (passedTitle == 'name') {
      if ($scope.nameSort == 'asc') {
        $scope.dataset.sort(function(a, b) {
          var x = a.name.toLowerCase();
          var y = b.name.toLowerCase();
          if (x < y) {
            return -1;
          }
          if (x > y) {
            return 1;
          }
          return 0;
        });
        $scope.nameSort = 'desc';
      } else {
        if ($scope.nameSort == 'desc') {
          $scope.dataset.sort(function(a, b) {
            var x = a.name.toLowerCase();
            var y = b.name.toLowerCase();
            if (x > y) {
              return -1;
            }
            if (x < y) {
              return 1;
            }
            return 0;
          });
          $scope.nameSort = 'asc';
        }
      }
    }

    if (passedTitle == 'age') {
      if ($scope.nameSort == 'asc') {
        $scope.dataset.sort(function(a, b) {
          return a.age - b.age
        });
        $scope.nameSort = 'desc';
      } else {
        if ($scope.nameSort == 'desc') {
          $scope.dataset.sort(function(a, b) {
            return b.age - a.age
          });
          $scope.nameSort = 'asc';
        }
      }
    }
  }

});

th,
td {
  border: 2px double red;
}

button,
button:focus {
  background: transparent;
  border: none;
  outline: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">

  <table>
    <thead>
      <th> <button type='button' ng-click="sortBy('name')">Name</button></th>
      <th> <button type='button' ng-click="sortBy('age')">Age</button></th>
    </thead>
    <tbody>
      <tr ng-repeat='data in dataset'>
        <td> {{data.name}} </td>
        <td> {{data.age}} </td>
      </tr>

    </tbody>
  </table>

</div>