javascript - Angular JS:使用JSON创建表

我已经在angular-JS中创建了一个应用程序，用于使用JSON中的动态列创建表

例如，从服务返回的JSON结构位于主JSON的other字段包含另一个JSON数组（即附加列）的结构中，

因此，总共会有四个附加的动态列，即文件1，文件2，文件3，文件4每个对象都有对应的“文件”字段的值，有时不存在。

$scope.getColumns = function()
{
    //console.log( $scope.datas[0].others[0]);
  $scope.datas.resultsOrder = new Array();
     for ( var i = 0; i < $scope.datas.length; i++)
     {
       for ( var j = 0; j < $scope.datas[i].others.length; j++)
        {
        if (countInstances($scope.datas.resultsOrder, $scope.datas[i].others[j].id) < countInstances(
                    $scope.datas[i].others, $scope.datas[i].others[j].id)){
           $scope.datas.resultsOrder.push($scope.datas[i].others[j].id);
         }
        }
      }
$scope.datas.resultsOrder.sort(function(a, b){
    return a.localeCompare(b);
  });
return $scope.datas.resultsOrder;
}

我已经使用javascript帮助完美地显示了带有动态列的表格，但是任何人都可以告诉我另一种通过angular js创建上述动态表格的方法，因为在我的代码中我使用了javascript复杂逻辑创建动态列，如下所示

我的JS小提琴如下

Demo

最佳答案

这将创建一个称为“列”的对象，其中属性是动态列的名称（“文件1”，“文件2”等）。
控制器：

$scope.columns = {};

angular.forEach( $scope.datas, function(data){

    angular.forEach( data.others, function(other){

        // Set the 'File x' property for each item in the others array
        data[other.id] = other.value;

        // Add the dyanmic column to the columns object
        $scope.columns[other.id] = null;
    });
});

视图：

<!-- table header -->
<tr>
    <th ng-repeat="(column,val) in columns">
        <a ng-click="sort_by()"><i>{{column}}</i></a>
    </th>
....
</tr>

<!-- data rows -->
<td ng-repeat="(column,v) in columns">{{val[column]}}</td>

Fiddle

关于javascript - Angular JS:使用JSON创建表，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22273103/