javascript - ng-repeat在Angular.js中产生额外的td

https://jsfiddle.net/gdrkftwm/

我正在使用对象Json生成表。我的问题是我有一个额外的td，我不知道，因为它正在生成，但是我想要一个像图像的结构：

     <div ng-app="app">
        <div ng-controller="Controller">
            <table border='1'>
              <tr>
                <th rowspan="2">Tipo de Contenido</th>
                <th colspan="{{aTipoUsuarios.length}}">Tipo de Usuarios</th>
              </tr>
              <tr>
              <td ng-repeat="usu in aTipoUsuarios">{{usu}}<td>
              </tr>

            </table>

        </div>
    </div>

    angular.module('app', [])
      .controller('Controller', function ($scope) {

    $scope.aRoles=
     [
       {
         "tipo_contenido": "articulos",
         "tipo_usuario":{
          "administrador":
           {"escritura":true, "lectura":true, "eliminacion":true},
          "reportante":
           {"escritura":true, "lectura":true, "eliminacion":true}
         }
       },
       {
         "tipo_contenido": "informacion",
         "tipo_usuario":{
          "administrador":
           {"escritura":true, "lectura":true, "eliminacion":true},
          "reportante":
           {"escritura":true, "lectura":true, "eliminacion":true}
         }
       },
     ]
    $scope.aTipoUsuarios=Object.keys($scope.aRoles[0].tipo_usuario);
    console.log($scope.aTipoUsuarios)


   });

最佳答案

应该是typo，

更改

从

<td ng-repeat="usu in aTipoUsuarios">{{usu}}<td>

至

<td ng-repeat="usu in aTipoUsuarios">{{usu}}</td>

演示

angular.module('app', [])
.controller('Controller', function ($scope) {
$scope.aRoles=
         [
           {
             "tipo_contenido": "articulos",
             "tipo_usuario":{
              "administrador":
               {"escritura":true, "lectura":true, "eliminacion":true},
              "reportante":
               {"escritura":true, "lectura":true, "eliminacion":true}
             }
           },
           {
             "tipo_contenido": "informacion",
             "tipo_usuario":{
              "administrador":
               {"escritura":true, "lectura":true, "eliminacion":true},
              "reportante":
               {"escritura":true, "lectura":true, "eliminacion":true}
             }
           },
         ];             $scope.aTipoUsuarios=Object.keys($scope.aRoles[0].tipo_usuario);
        console.log($scope.aTipoUsuarios)
});

!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title></title>
</head>
<body ng-app="app">
        <div ng-controller="Controller">
            <table border='1'>
              <tr>
                <th rowspan="2">Tipo de Contenido</th>
                <th colspan="{{aTipoUsuarios.length}}">Tipo de Usuarios</th>
              </tr>
              <tr>
              <td ng-repeat="usu in aTipoUsuarios">{{usu}}</td>
              </tr>
            </table>
        </div>
  <script type=" text/javascript " src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js "></script>
  <script type="text/javascript " src="MainViewController.js "></script>
</body>
</html>

关于javascript - ng-repeat在Angular.js中产生额外的td，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42185003/