納克重複在Angular.js

https://jsfiddle.net/gdrkftwm/納克重複在Angular.js

我使用的對象的Json生成表產生一個額外的TD。我的問題是，我有一個額外的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) 


    });

來源

2017-02-12 yavg

應該是typo，

變化

從

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

要

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

DEMO

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>

來源

2017-02-12 07:31:38 Sajeetharan

與NG-重複相關的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> <!-- close this tag --> 
      </tr> 

     </table> 

    </div> 
</div>

https://jsfiddle.net/fzwr0hf0/1/

來源

2017-02-12 07:08:53

一切都很好與你的角碼。問題在於ng-repeat html。

所以，請更改

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

您可以點擊此處查看 https://jsfiddle.net/gdrkftwm/2/

來源

2017-02-12 07:49:58

納克重複在Angular.js

回答

相關問題