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

【问题标题】：how to use ng-repeat when some fields of the object are missing当对象的某些字段丢失时如何使用 ng-repeat
【发布时间】：2017-07-03 20:26:16
【问题描述】：

我在一个对象上使用 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 中，我想为每个月/季度显示这些（在每种技术下，相应的技术下）。百分比值计算正确。月/季度显示正确。但是，数据显示不正确（有时 % 使用了错误的技术）。我的用户界面看起来像，

如何解决？

【问题讨论】：

标签： javascript css angularjs ng-repeat

【解决方案1】：

在你的最后一次重复中

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

我建议改为重复投资组合技术。

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>

【讨论】：