时间戳

首页 > 解决方案 > 如何将动态列表从 AngularJS 绑定到 Html 表？

html - 如何将动态列表从 AngularJS 绑定到 Html 表？

问题描述

我有一个角函数

             vm.OpenBManageContractBillingReport = function () {
                 reportService.GetContractBillingList(vm.Search).then(function (response) {
                     console.log(response);
                vm.contractBillingReportList = response;
            }, function (err) {

            });
        };

它给出了 API 列表的输出，动态列表存储在 vm.contractBillingReportList 中。但输出可能会有所不同根据开始日期和结束日期参数在vm.search. 例如：- IF start Date Parameter is 1/1/2018and End Date Parameter is31/1/2018结果仅提供一列 January 2018。类似地，IF start Date Parameter is 1/1/2018and End Date Parameter is31/12/2019结果提供 24 Col 从 2018 年 1 月到 2019 年 12 月。我该怎么做将此数据与 HTML 表中的标题列绑定？

            <div class="clearfix">
           <div class="reportTable">
               <div class="col-sm-12" style="padding:0;">
                   <table class="table table-bordered">
                       <thead>
                           <tr></tr>
                       </thead>
                       <tbody>
                           <tr ng-repeat="item in vm.contractBillingReportListtrack by $index">
                               <td></td>

                           </tr>
                       </tbody>
                   </table>
               </div>
           </div>
       </div>

标签： htmlangularjs

解决方案

假设 contractBillingReportList 是一个对象数组，其中包含所需对象的键作为标题。只需循环第一个元素中的键并将这些键显示为标题。

<tr>
  <th ng-repeat="(header, value) in vm.contractBillingReportList[0]">{{header}}</th>
</tr>

推荐阅读