Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/fortran/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Angular JS:使用json创建表_Javascript_Jquery_Json_Angularjs - Fatal编程技术网

Javascript Angular JS:使用json创建表

Javascript Angular JS:使用json创建表,javascript,jquery,json,angularjs,Javascript,Jquery,Json,Angularjs,我已经用angular JS创建了一个应用程序,用于从json创建带有动态列的表 例如,从服务返回的JSON结构位于主JSON的others字段包含另一个JSON数组(即附加列)的结构中 因此,总共将有四个附加的动态列,即文件1、文件2、文件3、文件4每个对象都有对应文件字段的值,有时存在,有时不存在 $scope.getColumns = function() { //console.log( $scope.datas[0].others[0]); $scope.datas.res

我已经用angular JS创建了一个应用程序,用于从json创建带有动态列的表

例如,从服务返回的JSON结构位于主JSON的others字段包含另一个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;
}
$scope.getColumns=function()
{
//console.log($scope.datas[0]。其他[0]);
$scope.datas.resultsOrder=新数组();
对于(变量i=0;i<$scope.datas.length;i++)
{
对于(var j=0;j<$scope.datas[i].others.length;j++)
{
如果(countInstances($scope.datas.resultsOrder,$scope.datas[i].others[j].id)
我已经使用javascript帮助完美地展示了带有动态列的表,但是有人能告诉我通过angular js以简单的方式创建上述动态表的其他方法吗?因为在我的代码中,我使用javascript复杂逻辑创建动态列,如下所示

下面是我的JS小提琴


此wll将创建一个名为columns的对象,其中属性是动态列的名称(“文件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;
    });
});
视图:



但是这里我们必须在fileInfo变量中硬编码文件1、文件2、文件3、文件4……因为我们不能这样做……因为这些动态列有时会不同……是否有其他方法使其过于动态……重复列如何说如果我有两个文件1,第一个对象的值不同,然后应该有两个文件1列正确…这个解决方案将不会满足重复列。如果你把答案标记为不可接受,我就把它删除。谢谢。可以创建重复的列吗?但不能使用此解决方案,因为它使用其他数组中每个项的属性。如果你不能接受这个答案,我就把它删掉。
<!-- 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>