javascript - Angular ng-repeat 的值错误?

标签 javascript angularjs angularjs-ng-repeat

正在循环访问对象数组内部的数组,如下所示:

<div ng-repeat="benefit in oe.oeBenefits">
    <div class="oeInfo" style="clear: both;">
        <div class="col-md-2 oeCol">
            <img style="height: 160px; padding-top: 20px;" src="ppt/assets/beneTiles/HealthCare.svg">
        </div>
        <div class="col-md-5 oeCol">
            <h1>{{ benefit.benefitName }}</h1>
            <p>Maximum Election Amount: {{ benefit.benefitMax }}</p>
            <p>Contributions to be made: {{ benefit.numberOfContributions }}</p>
            <p ng-show="benefit.employerSeed != null">{{ benefit.employerSeed }}</p>
            <p>link</p>
        </div>              
        <div class="col-md-3 oeCol">
            <p class="oeFeatures" style="font-weight: 800;">Available Features</p>
            <ul>
                <li ng-repeat="Features.value in oe.oeBenefits.Features">{{ Features.value }}</li>
            </ul>            
        </div>  
        <p></p>
        <div class="col-md-12">
            <hr class="naviaHR100">                    
        </div>
    </div>
</div>

我的 JSON 代码返回以下内容,但尽管发生了更改,但仍无法获取该值。这是返回的 JSON:

"oeBenefits": [
{
  "planId": "l0t3AlfKV%2fETUaQd0zZJGA%3d%3d",
  "benefitTypeId": 1,
  "benefitName": "Health Care FSA",
  "isHsaAvailable": false,
  "benefitMin": 0,
  "benefitMax": 3510,
  "numberOfContributions": 12,
  "carryoverAmount": null,
  "isDebitCard": true,
  "is100percent": true,
  "isGracePeriod": true,
  "allowDirectDeposit": true,
  "claimsRunout": 90,
  "employerSeed": "Your employer will contribute additional funds to your benefit",
  "learnMoreUrl": "http://www.naviabenefits.com/participants/benefits/health-care-fsa/",
  "Features": [
    {
      "key": "0",
      "value": "Navia Benefits Card"
    },
    {
      "key": "2",
      "value": "FlexConnect"
    },
    {
      "key": "4",
      "value": "Online claim submission"
    },
    {
      "key": "5",
      "value": "Online card swipe substantiation"
    }
  ]
},

来自对象的所有其他重复数据(s0 返回都很好,只是这个功能部分我只想要值,而不是键。

最佳答案

这应该可以解决您的问题

<div ng-repeat="benefit in oe.oeBenefits">
 <div class="oeInfo" style="clear: both;">
    <div class="col-md-2 oeCol">
        <img style="height: 160px; padding-top: 20px;" src="ppt/assets/beneTiles/HealthCare.svg">
    </div>
    <div class="col-md-5 oeCol">
        <h1>{{ benefit.benefitName }}</h1>
        <p>Maximum Election Amount: {{ benefit.benefitMax }}</p>
        <p>Contributions to be made: {{ benefit.numberOfContributions }}</p>
        <p ng-show="benefit.employerSeed != null">{{ benefit.employerSeed }}</p>
        <p>link</p>
    </div>              
    <div class="col-md-3 oeCol">
        <p class="oeFeatures" style="font-weight: 800;">Available Features</p>
        <ul>
            <li ng-repeat="feature in benefit.Features">{{ feature.value }}</li>
        </ul>            
    </div>  
    <p></p>
    <div class="col-md-12">
        <hr class="naviaHR100">                    
    </div>
</div>

问题在于您的内部循环没有使用正确的数组对象

关于javascript - Angular ng-repeat 的值错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35588130/

相关文章:

javascript - 如何找到一种过滤数组与另一个数组进行比较的方法

javascript - 根据lastChangedDate构造新数组

javascript - Angular - 数据表点击行事件

javascript - Angular JS : Function is not defined error in controller

javascript - AngularJS:如何在 ng-repeat 开始之前运行代码?

javascript - jQuery dataTables 自定义排序不适用于中文数字

javascript - 异步操作 DOM

javascript - 即时格式化日期

JavaScript:4 个异步函数在继续之前按顺序等待彼此完成?

javascript - 如何在 angularjs 中使用 ng-repeat 遍历 JavaScript map ?