根据Angular中的标题

Question

我正在处理的是在单个或多个列的表中执行排序操作。我们假设我们有一个这样的表。

单击标题1时，只有在单击标题2时才应对数据1和数据2进行排序，数据3和数据4需要排序。

对Angular中的表实现了简单排序，但无法了解如何在单个列中使用两组数据实现此类。

即使尝试使用单独的表，因为Angular中的顺序基于数组中的键，单击标题1时（数据1,2,3和4）都会更新。

ng-repeat用于形成表

有人能指出我正确的方向（在Angular 1.x上）吗？

Sample Fiddle http://jsfiddle.net/ANEA6/13/

Answer 1

问题是您使用相同的变量来处理反向！

<div ng-controller="MyCtrl">
  <table class="table">
    <tr class="heading">
      <td ng-click="reverse1=!reverse1;predicate1='id'">id</td>
    </tr>
    <tr ng-repeat="user in users | orderBy:predicate1:reverse1">
      <td>{{user.id}}</td>
    </tr>
    <tr class="heading">
      <td ng-click="reverse2=!reverse2;predicate2='id'">id</td>
    </tr>
    <tr ng-repeat="user in users | orderBy:predicate2:reverse2">
      <td>{{user.id}}</td>
    </tr>
  </table>
</div>

你可以查看这个工作小提琴==＆gt; http://jsfiddle.net/ANEA6/17/

Answer 2

为什么不为每个<tr>创建一个单独的范围变量，其中id内有<td>

<div ng-controller="MyCtrl">
  <table class="table">
      <tr><td ng-click="reverse1=!reverse1;predicate1='id'">id</td></tr>
      <tr ng-repeat="user in users | orderBy:predicate1:reverse1">
          <td>{{user.id}}</td>
      </tr>
      <tr><td ng-click="reverse2=!reverse2;predicate2='id'">id</td></tr>
      <tr ng-repeat="user in users | orderBy:predicate2:reverse2">
          <td>{{user.id}}</td>
      </tr>
    </table>
</div>

控制器

var myApp = angular.module('myApp',[]);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
    $scope.users = [
        {id:1},
        {id:2}

    ]
}

这应该适用于您的情况，因为我看不到<td>动态生成id。它被硬编码为id的两行。身份<tr>后面的其他<tr>是使用ng-repeat动态生成的，所以这应该没问题。

为了您的简单，这里是JSFIDDLE

的工作链接