在Angularjs中生成​​動態？

Question

http://jsfiddle.net/42p561zn/

我的問題是，我想完成的行，用NG-重複，但無論我怎麼努力，我不能讓它動態地完成。我需要這件作品：

----------- I need use ng-repeat in this piece ng-repeat="usu in atypeUsers" 
     <td >READ</td> 
     <td >EDIT</td> 
     <td >DELETE</td> 
------------------- 

我需要用ng-repeat生成這個，我必須使它動態。我的問題不知道該把它放在哪裏。如果我這樣做，它會下降。 我一定不能修改我的json的結構。

$scope.aRoles= 
    [ 
     { 
     "type_content": "articles", 
     "type_usuario":{ 
      "administrator": 
      {"write":true, "read":true, "delete":true}, 
      "other": 
      {"write":true, "read":true, "delete":true} 
     }  
     }, 
     { 
     "type_content": "papers", 
     "type_usuario":{ 
      "administrator": 
      {"write":true, "read":true, "delete":true}, 
      "other": 
      {"write":true, "read":true, "delete":true} 
     }  
     }, 
    ]   
    $scope.atypeUsers=Object.keys($scope.aRoles[0].type_usuario); 


    <table border='1'> 
     <tr> 
     <th rowspan="3">Type of content</th> 
     <th colspan="{{atypeUsers.length * 3}}"> 
      Type of users 
     </th> 
     </tr> 
     <tr> 
     <td ng-repeat="usu in atypeUsers" colspan="3"> 
     {{usu}} 
     </td> 
     </tr> 
     <tr> 

     ----------- I need use ng-repeat in this piece ng-repeat="usu in atypeUsers" 
     <td >READ</td> 
     <td >EDIT</td> 
     <td >DELETE</td> 
     ------------------- 
     </tr> 
     <tr> 
     <tr ng-repeat="rol in aRoles"> 
     <td>{{rol.type_content}}</td> 
     <td >true</td> 
     <td >false</td> 
     <td >true</td> 
     <td >false</td> 
     <td >true</td> 
     <td >false</td> 
     </tr> 
    </table> 

我需要這個

Answer 1

檢查以下ng-repeat

angular.module('app', []) 
 
.controller('ctrl', function($scope){ 
 
$scope.aRoles= 
 
    [ 
 
     { 
 
     "type_content": "articles", 
 
     "type_usuario":{ 
 
      "administrator": 
 
      {"write":true, "read":true, "delete":true}, 
 
      "other": 
 
      {"write":true, "read":true, "delete":true} 
 
     }  
 
     }, 
 
     { 
 
     "type_content": "papers", 
 
     "type_usuario":{ 
 
      "administrator": 
 
      {"write":true, "read":true, "delete":true}, 
 
      "other": 
 
      {"write":true, "read":true, "delete":true} 
 
     }  
 
     }, 
 
    ]   
 
    $scope.atypeUsers=Object.keys($scope.aRoles[0].type_usuario); 
 

 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
     
 
<div ng-app="app" ng-controller="ctrl"> 
 
    <table border='1'> 
 
     <tr> 
 
     <th rowspan="3">Type of content</th> 
 
     <th colspan="{{atypeUsers.length * 3}}"> 
 
    Type of users 
 
     </th> 
 
     </tr> 
 
     <tr> 
 
     <td ng-repeat="usu in atypeUsers" colspan="3"> 
 
     {{usu}} 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     <td ng-repeat-start="usu in atypeUsers">READ</td> 
 
     <td >EDIT</td> 
 
     <td ng-repeat-end>DELETE</td> 
 
     ------------------- 
 
     </tr> 
 
     <tr ng-repeat="rol in aRoles"> 
 
     <td>{{rol.type_content}}</td> 
 
     <td >true</td> 
 
     <td >false</td> 
 
     <td >true</td> 
 
     <td >false</td> 
 
     <td >true</td> 
 
     <td >false</td> 
 
     </tr> 
 
    </table> 
 
    </div>

Answer 2

也許使用ng-repeat-start and ng-repeat-end

<tr> 
    <th rowspan="3">Type of content</th> 
    <th colspan="{{atypeUsers.length * 3}}"> 
     Type of users 
    </th> 
    </tr> 

    <tr> 
    <td ng-repeat="usu in atypeUsers" colspan="3"> 
    {{usu}} 
    </td> 
    </tr> 

    <tr> 
    <td ng-repeat-start="usu in atypeUsers"> 
    READ 
    </td> 
    <td> 
    EDIT 
    </td> 
    <td ng-repeat-end> 
    DELETE 
    </td> 
    </tr> 

Answer 3

也許你可以定義另一個函數來讀取你的json並創建一個數組來填充權限，你可以簡單地在代碼中用ngrepeat在<td>中使用它。

我已經用這種方法實現了你想要的東西，儘管我的代碼很麻煩，你可以根據你的需求來完善它。

檢查這個plunker