我想用JSON渲染表。键应为TH标签,其值应为TD标签。我设法以其他方式呈现表格:

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope){
    $scope.init = function(){
        $scope.json = {
            "entities":{"bezeichnung":"Basis","name":"Basis","id":16},
            "entities2":{"bezeichnung":"Basis2","name":"Basis2","id":17}
        }
    }

});
</script>

<div ng-app="myApp" ng-controller="myCtrl" ng-init="init()">
    <div ng-repeat="(key,value) in json">
        <table border="1">
            <tr ng-repeat="(k,val) in value"><td>{{k}}</td><td>{{val}}</td></tr>
        </table>
    </div>
</div>


但是如何反过来呢?

jsfiddle

最佳答案

您需要遍历键的标题一次,然后遍历该行的值。

<div ng-app="myApp" ng-controller="myCtrl" ng-init="init()">
  <div ng-repeat="(key, table) in json">
    <table border="1">
      <thead>
        <tr>
          <th ng-repeat="(key, _) in table">{{key}}</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td ng-repeat="(_, value) in table">{{value}}</td>
        </tr>
      </tbody>
    </table>
  </div>
</div>


更新了jsfiddle

10-05 22:57