如何删除 ng-repeat 的默认顺序答案

【问题标题】：How to remove default order of ng-repeat如何删除 ng-repeat 的默认顺序
【发布时间】：2018-01-31 17:24:48
【问题描述】：

如何在 ng-repeat 中停止对动态表数据的默认排序？目前我的订单如下：

地址 |客户 ID |名称

但我想要的是低于订购：

客户 ID |姓名 |地址

任何帮助将不胜感激。

JS：

app.controller('MyController', function ($scope) {
  $scope.Customers = [
    { CustomerId: 1, Name: "John Hammond", Addr:'India'
    },
    {
      CustomerId: 2, Name: "Mudassar Khan", Addr:'India'
    },
    {
      CustomerId: 3, Name: "Suzanne Mathews",  Addr:'India'
    },
    {
      CustomerId: 4, Name: "Robert Schidner",  Addr: 'India'
    }
  ];

});

HTML：

<table>
  <tr >
    <th ng-repeat="(key,value) in Customers[0]">{{key}}</th>
  </tr>
  <tbody ng-repeat="c in Customers">
    <tr>
    </tr>
  </tbody>
</table>

【问题讨论】：

标签： javascript html angularjs angularjs-ng-repeat

【解决方案1】：

试试下面的方法。我希望下面的 sn-p 结果显示了您想要的结果。

angular.module("aaa",[]).controller('MyController', function ($scope) {        
         $scope.Customers = [
            { CustomerId: 1, Name: "John Hammond", Addr:'India'          
            },
            {
                CustomerId: 2, Name: "Mudassar Khan", Addr:'India'                   
            },
            {
                CustomerId: 3, Name: "Suzanne Mathews",  Addr:'India'                  
            },
            {
                CustomerId: 4, Name: "Robert Schidner",  Addr: 'India'                   
            }
           ];       
           $scope.keys = Object.keys($scope.Customers[0]);

    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="aaa" ng-controller="MyController">
  <table>
           <tr>
                <th ng-repeat="key in keys"> 
    {{key}}
              </th>               
        </tr>
        <tbody ng-repeat="c in Customers">
            <tr>
              <td ng-repeat="key in keys">{{c[key]}}</td>                   
            </tr>
        </tbody>
    </table>
</div>

【讨论】：

【解决方案2】：

所以 JS 中的对象本质上是无序的。您可以做的只是对标题中的键进行硬编码，如果该键将针对该特定表进行修复，然后按相应顺序打印值。

类似这样的：

<table>
  <tr >
    <th>CustomerId</th>
    <th>Name</th>
    <th>Addr</th>
  </tr>
  <tbody>
    <tr ng-repeat="c in Customers">
       <td>{{CustomerId}}</td>
       <td>{{Name}}</td>
       <td>{{c.Addr}}</td>
    </tr>
  </tbody>
</table>

注意：我将 ng-repeat 放在 tr 上，这可能是您需要的。我认为你不应该把它放在身体上。

【讨论】：

【解决方案3】：

你是指数据的排序顺序还是列的显示顺序？

接受的答案按指定的列顺序显示数据，但如果您希望数据本身排序，则只需向数据添加过滤器，如下所示：

<tbody ng-repeat="c in Customers|orderBy:['CustomerId','Name','Addr']">

这会按指定的字段对列表中的实际数据进行排序。

【讨论】：