在我的 Angular 应用程序中,我试图在表中显示JSON数据。数据如下所示:

$scope.data =
  {
    "EVENT NAME":"Free Event",
    "ORDER ID":311575707,
    "DATE":"6/26/14",
    "GROSS REVENUE (USD)":"0",
    "TICKET REVENUE (USD)":"0",
    "EVENTBRITE FEES (USD)":"0",
    "CC PROCESSING (USD)":"0",
    "TICKETS":1,
    "TYPE":"Free Order",
    "STATUS":"Free Order",
    "TRANSACTION ID":"",
    "NOTES":"",
    "FIRST NAME":"Khee Seng",
    "LAST NAME":"Chua",
    "EMAIL ADDRESS":"email@anemailadderss.com"
  };

我正在这样显示它:
   <table class="table table-striped selector">
      <tbody>
        <tr>
          <td ng-repeat="(key, value) in data">
            <strong>{{key}}</strong>
          </td>
        </tr>
        <tr>
          <td ng-repeat="(key, value) in data">
                    {{value}}
                </td>
        </tr>
      </tbody>
    </table>

在我看来,这应该遍历对象中的每个`(key,value)对,并按顺序显示。但是,AngularJS以字母顺序显示值。

这是一个复制了此问题的插件:http://plnkr.co/edit/V3Y2ZuwV1v9Pzsl0jGhA?p=preview

如何调整代码,使其以对象实际进入的自然顺序显示?

最佳答案

你可以这样实现

Working Demo

在范围内定义一个如图所示的方法

$scope.notSorted = function(obj){
    if (!obj) {
        return [];
    }
    return Object.keys(obj);
}

并在html中,如下所示

html
<table class="table table-striped selector">
  <tbody>
    <tr>
      <th ng-repeat="key in notSorted(data)">
         {{key}}
      </th>
    </tr>
    <tr>
      <td ng-repeat="key in notSorted(data)" ng-init="value = data[key]">
            {{value}}
         </td>
    </tr>
  </tbody>
</table>

原始文章: ng-repeat with no sort? How?

关于javascript - 按字母顺序停止AngularJS ng-repeat渲染,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/24656912/

10-12 12:38
查看更多