在Angular中有多个字段

7 回答

• 21

  请看这个：

  http://jsfiddle.net/JSWorld/Hp4W7/32/

  <div ng-repeat="division in divisions | orderBy:['group','sub']">{{division.group}}-{{division.sub}}</div>
  

  回复于 2024-05-03T22:53:07+08:00
• 617

  有两种方法可以使用AngularJs过滤器，一种在HTML中使用{{}}，一种在实际的JS文件中......

  您可以使用以下方法解决问题：

  {{ Expression | orderBy : expression : reverse}}
  

  如果您在HTML中使用它或使用类似的东西：

  $filter('orderBy')(yourArray, yourExpression, reverse)
  

  反面是可选的，它接受一个布尔值，如果它是真的，它会为你反转数组，非常方便地反转你的数组......

  回复于 2024-05-03T22:53:07+08:00
• -7

  可以通过在angular中使用'orderBy'过滤器来完成排序 .

  两种方式：1 . 从视图2.从控制器

  • 从视图

  句法：

  {{array | orderBy : expression : reverse}}
  

  例如：

  <div ng-repeat="user in users | orderBy : ['name', 'age'] : true">{{user.name}}</div>
  

  • 来自控制器

  句法：

  $filter.orderBy(array, expression, reverse);
  

  例如：

  $scope.filteredArray = $filter.orderBy($scope.users, ['name', 'age'], true);
  

  回复于 2024-05-03T22:53:07+08:00
• 45

  <select ng-model="divs" ng-options="(d.group+' - '+d.sub) for d in divisions | orderBy:['group','sub']" />
  

  用户数组而不是多个orderBY

  回复于 2024-05-03T22:53:07+08:00
• 5

  确保最终用户的排序不复杂 . 我一直认为对组和子组进行排序有点复杂 . 如果它是技术最终用户，那可能没问题 .

  回复于 2024-05-03T22:53:07+08:00
• 0

  如果你想对控制器内的多个字段进行排序，请使用此方法

  $filter('orderBy')($scope.property_list, ['firstProp', 'secondProp']);
  

  另见https://docs.angularjs.org/api/ng/filter/orderBy

  回复于 2024-05-03T22:53:07+08:00
• 5

  我写了这个方便的部分来按对象的多个列/属性进行排序 . 单击每个连续列后，代码会存储单击的最后一列，并将其添加到不断增加的单击列字符串名称列表中，并将它们放在名为sortArray的数组中 . 内置的Angular“orderBy”过滤器只是读取sortArray列表，并按存储在那里的列名的顺序对列进行排序 . 因此，最后一次单击的列名称将成为主要有序过滤器，前一个名称将单击下一个优先级，等等 . 相反的顺序会立即影响所有列的顺序，并为完整的数组列表集切换升序/降序：

  <script>
      app.controller('myCtrl', function ($scope) {
          $scope.sortArray = ['name'];
          $scope.sortReverse1 = false;
          $scope.searchProperty1 = '';
          $scope.addSort = function (x) {
              if ($scope.sortArray.indexOf(x) === -1) {
                  $scope.sortArray.splice(0,0,x);//add to front
              }
              else {
                  $scope.sortArray.splice($scope.sortArray.indexOf(x), 1, x);//remove
                  $scope.sortArray.splice(0, 0, x);//add to front again
              }
          };
          $scope.sushi = [
          { name: 'Cali Roll', fish: 'Crab', tastiness: 2 },
          { name: 'Philly', fish: 'Tuna', tastiness: 2 },
          { name: 'Tiger', fish: 'Eel', tastiness: 7 },
          { name: 'Rainbow', fish: 'Variety', tastiness: 6 },
          { name: 'Salmon', fish: 'Misc', tastiness: 2 }
          ];
      });
  </script>
  <table style="border: 2px solid #000;">
  <thead>
      <tr>
          <td><a href="#" ng-click="addSort('name');sortReverse1=!sortReverse1">NAME<span ng-show="sortReverse1==false">&#9660;</span><span ng-show="sortReverse1==true">&#9650;</span></a></td>
          <td><a href="#" ng-click="addSort('fish');sortReverse1=!sortReverse1">FISH<span ng-show="sortReverse1==false">&#9660;</span><span ng-show="sortReverse1==true">&#9650;</span></a></td>
          <td><a href="#" ng-click="addSort('tastiness');sortReverse1=!sortReverse1">TASTINESS<span ng-show="sortReverse1==false">&#9660;</span><span ng-show="sortReverse1==true">&#9650;</span></a></td>
      </tr>
  </thead>
  <tbody>
      <tr ng-repeat="s in sushi | orderBy:sortArray:sortReverse1 | filter:searchProperty1">
          <td>{{ s.name }}</td>
          <td>{{ s.fish }}</td>
          <td>{{ s.tastiness }}</td>
      </tr>
  </tbody>
  </table>
  

  回复于 2024-05-03T22:53:07+08:00