在AngularJS中显示动态JSON

从web服务中，我得到一个JSON字符串。它可能根据请求而有所不同。2个JSON结果是

结果1

[
  {
    "Key": 1,
    "ID": 1,
    "applicationId": "1",
    "applicationName": "APP1"
  },
  {
    "Key": 2,
    "ID": 1,
    "applicationId": "2",
    "applicationName": "APP2"
  }
]

结果2

[
  {
    "OrgKey": 1,
    "ID": 1,
    "OrgID": "1",
    "OrgName": "Org1"
  },
  {
    "OrgKey": 2,
    "ID": 4,
    "OrgID": "6",
    "OrgName": "Org2"
  }
]

我将如何在表格中显示此内容

在controllerjs文件中，我使用

$http.get

方法，在Success方法中，我将

$scope.resultData = data;

但在HTML中，我将如何显示动态内容

<table>
<thead>
  <tr>
    <th ng-repeat = "result in resultData">
     <!-- Not the right way -->
     <!-- Here I want to put the headers like "Key,ID" ... -->
    </th>
   </tr> </thead>
  <tbody>
  <tr ng-repeat = ""result in resultData">
   <td> {{result.Key }} </td>
   <!-- When the firlds vary, how to put? ->
  </tr>
  </tbody>
</table>

首先，您应该获得第一行来设置表的标题，如下所示

<thead>
  <tr>
    <th ng-repeat="(header, value) in resultData[0]">
      {{header}}
    </th>
  </tr>
</thead>

这里正在工作

更新

一些用户询问是否可以在不排序标题及其值的情况下处理此问题

答案是是，但在开始之前，你应该知道为什么它已经按字母顺序排序了

angular
ng repeat
指令对数组和对象的作用不同。。。如果您使用数组，您可以使其可排序，但这不是对象的选项，这里有一个关于它的

所以现在最好的方法是在我们在ng repeat中使用对象值之前，将它们推入数组中

这是第二个

注意：您将看到我从数组中删除了$$hashKey，因为它们不是原始元素的属性，所以我会自动将它们添加到对象中以观察更改
我能够根据其他人的示例和文档构建一个动态表


{{header}}
{{cell}}

虽然这些列的顺序不好，但在我的.net项目中，它们的顺序是正确的。
也许这不是最好的解决方案，但它确实对我非常有效。在我的
当前项目im使用webSocket传输数据，需要在从服务器获取数据后立即在ui中动态显示

所以解决方案很简单，我想怎么做就怎么做

在$timeout中结束函数


vm.testErrors=[]；
socket.onmessage（函数（事件）{
如果（event.data！=“已连接”）{
$timeout（函数（）{
addNewTestWithError（事件数据）；
}, 0);
} 
});
看到这个答案，它可能会帮助您：基于，确保您以正确的方式实现
$http.get
（异步调用）。否则，HTML将不显示任何内容。但是JSON格式是相同的。在我的回复中，我发布了第二个带有DynamicTableHi的示例。我只是想知道这是否可以在不进行行排序的情况下完成！现在，表标题正在按字母顺序排序
<tbody>
  <tr ng-repeat="row in resultData">
    <td ng-repeat="cell in row">
      {{cell}}
    </td>
  </tr>
</tbody>

<tr>
    <th class="{{header}}" ng-repeat="(header, value) in items[0]" ng-click="changeSorting(header)">
    {{header}}
  <i ng-class="selectedCls2(header)"></i>
</tr>
<tbody>
<tr ng-repeat="row in pagedItems[currentPage] | orderBy:sort.sortingOrder:sort.reverse">
    <td ng-repeat="cell in row">
          {{cell}}
   </td>
</tr>