Javascript 使用动态表格标题以角度显示表格

我正在创建一个angular应用程序来显示来自各种数据源的数据。我在JSON文件中配置了各种数据源的列表，每个数据源都有一组附加值。 这里有一个例子

var configurableConfigurations=[
   {
       name:"Locations",
       table:"location_set",
       columnList:[
          {
              name:"LOCATION_NAME",
              alias:"Location",
              primary:true
          },
          {
              name:"DESCRIPTION",
              alias:"Description",
              primary:false
          } 
       ]
   },
   {
       name:"System Parameters",
       table:"system_params",
       columnList:[
                  {
                      name:"param_Key",
                      alias:"Parameter",
                      primary:true
                  },
                  {
                      name:"param_Value",
                      alias:"Value",
                      primary:false
                  } 
       ]
   }
];

然后我用angular创建了一个HTML页面来显示它：该页面有两个部分 1.一个显示各种参数的选择框，使用ng repeat完成此操作

我希望使用所选参数的标题生成的表 这是我的代码

<table id="configtable">
<thead>
    <tr>                
        <th class="col-md-1" ng-repeat="column in selected.columnList" >{{column.alias}}</th>                   
    </tr>
</thead>

---

事实证明，只有在使用DataTable时，才会出现标题消失的问题。我不知道表数据是如何存储的，但这种方法很好：

$scope.configurableConfigurations = [{
    name: "Locations",
    table: "location_set",
    columnList: [{
      name: "LOCATION_NAME",
      alias: "Location",
      primary: true
    }, {
      name: "DESCRIPTION",
      alias: "Description",
      primary: false
    }],
    data:[[12,"home"],[43,"work"]]
  }, {
    name: "System Parameters",
    table: "system_params",
    columnList: [{
      name: "param_Key",
      alias: "Parameter",
      primary: true
    }, {
      name: "param_Value",
      alias: "Value",
      primary: false
    }],
    data:[["GOO",586],["FOO",123]]
  }];

然后你可以像这样打印表格：

<select name="ConfigurationName" ng-model="selected" ng-options="eachConfiguration as  eachConfiguration.name for eachConfiguration in configurableConfigurations" ng-change="fetchRequiredConfiguration()"></select>
    <table id="configtable">
      <thead>
        <tr>
          <th class="col-md-1" ng-repeat="column in selected.columnList">{{column.alias}}</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="row in selected.data" >
          <td class="col-md-1" ng-repeat="col in row">{{col}}</td>
        </tr>
      </tbody>
    </table>

{{column.alias}}
{{col}}

---

示例

感谢您的回复，我漏掉了问题中的一部分（调试后证明是至关重要的）。只有在使用数据表时，标题才会丢失。我已经编辑了这个问题。您好，您在哪里可以解决上述问题？

<select name="ConfigurationName" ng-model="selected" ng-options="eachConfiguration as  eachConfiguration.name for eachConfiguration in configurableConfigurations" ng-change="fetchRequiredConfiguration()"></select>
    <table id="configtable">
      <thead>
        <tr>
          <th class="col-md-1" ng-repeat="column in selected.columnList">{{column.alias}}</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="row in selected.data" >
          <td class="col-md-1" ng-repeat="col in row">{{col}}</td>
        </tr>
      </tbody>
    </table>