Angular - 为不同对象的 ng-repeat 创建一个动态模板

Question

假设我有一个对象数组。我需要使用 ng-repeat 动态创建 table。问题是，我不想将对象的每个属性都硬编码到 html。我创建了一个数组，其中包含当前对象的相关键（输入有时可能不同）。我如何创建 ng-repeat，它将运行覆盖数据数组的每个对象并打印我之前创建的 keys 数组的每个属性？

xlsxTableProps 是一个包含字符串的数组，这些字符串是 parsedXslxData 对象数组中每个对象的键。

这就是我为输入创建键的方式（同样，每次都可以不同）
JS:

    Object.keys(this.parsedXslxData[0]).forEach(key => {
        this.xlsxTableProps.push(key)
      });

HTML:

<table class="table">
    <thead>
        <tr>
            <th scope="col">#</th>
            <th scope="col" ng-repeat="header in $ctrl.xlsxTableProps">{{header}}</th>                        
        </tr>
    </thead>
    <tr ng-repeat="item in $ctrl.parsedXslxData">
        <td>{{$index}}</td>
        <td ng-repeat="tableItem in $ctrl.xlsxTableProps"></td>
        <td>{{item[{{tableItem}}]}}</td>
    </tr>
</table>

Answer 1

这里的语法有问题 {{item[{{tableItem}}]}}，不需要使用额外的一对括号。只需使用 {{item[tableItem]}}.

Angular - 为不同对象的 ng-repeat 创建一个动态模板

Angular - create a dynamic template for ng-repeat over different objects

angularjs

angularjs-ng-repeat