当对象的某些字段丢失时如何使用 ng-repeat

Question

我正在对象上使用 Angular JS 的 ng-repeat。我的代码就像

<thead>
     <tr>
        <th style="text-transform: capitalize;">{{monthOrquarter || "month"}}
        </th>
        <th ng-repeat="tech in dashboardSrv.portfolioTech">{{tech}}
        </th>
      </tr>
</thead>
<tbody>
     <tr ng-repeat="(month, data) in dashboardSrv.portfolio[monthOrquarter || 'month']">
       <td class="rt-td1" style="border-bottom: 1px solid white !important; border-top: 2px;">{{month}}
       </td>
       <td class="rt-td1" style="border-bottom: 1px solid white !important; border-top: 2px;" ng-repeat="(tech, percentage) in data" ng-show="data.tech != 'total'">{{percentage  | number: 2}}%
       </td>
     </tr>
 </tbody>

现在 dashboard.portfoliotech 看起来像， dashboard.portfolioTech = { 'Contact Center EA', 'Contact Center HCS','Contact Center Other','Remote Expert'}

但是，dashboard.portfolio 是一个看起来像

在dashboardSrv、var s=this 但是在 UI 中，我想为每个月/季度显示这些（在每种技术下，对应的技术）。百分比值计算正确。月/季度显示正确。但是，数据显示不正确（有时 % 使用错误的技术）。我的 UI 看起来像，

如何解决？

Answer 1

在你最后一次重复

ng-repeat="(tech, percentage) in data"

我建议改为重复 portfolioTech。

ng-repeat="tech in dashboardSrv.portfolioTech"

并在您后面的绑定中放置

{{data[tech] | number: 2}}%

简而言之：

这一行：

<td class="rt-td1" style="border-bottom: 1px solid white !important; border-top: 2px;" ng-repeat="(tech, percentage) in data" ng-show="data.tech != 'total'">{{percentage  | number: 2}}%
   </td>

变成这条线：

<td class="rt-td1" style="border-bottom: 1px solid white !important; border-top: 2px;" ng-repeat="tech in dashboardSrv.portfolioTech" ng-show="data.tech != 'total'">{{data[tech]  | number: 2}}%
   </td>

当对象的某些字段丢失时如何使用 ng-repeat

how to use ng-repeat when some fields of the object are missing

javascript

css

angularjs

ng-repeat