javascript - 如何对多个对象数组使用 ng-repeat?

标签 javascript html angularjs

所以我有这两个对象数组。我想使用 ng-repeat 以便它在与日期相同的索引处打印来自 countOfServicesCodesByElements 的元素。所以对于日期开始:“09. 09. 2016”, end: "13. 09. 2016"应该输出23,以此类推。

  $scope.countOfServicesCodesParts = [ {
        start: "09. 09. 2016",
        end: "13. 09. 2016"
      },
      {
        start: "15. 09. 2016",
        end: "18. 09. 2016"
      },
      {
        start: "27. 09. 2016",
        end: "30. 09. 2016"
      }
    ]
  $scope.countOfServicesCodesByElements = [{
        "count": 23
      },
      {
        "count": 30
      },
      {
        "count": 20
      },
      {
        "count": 2
      }
    ]

这是我的html文件


  <div class="card-content" ng-if="countOfServicesCodesEval != 0" ng-repeat="date in countOfServicesCodesParts" >
    <table class="table table-striped">
      <tr >
        <span span ng-if="countOfServicesCodes != 0" style="font-weight:bold">
          date start {{date.start}} date end: {{date.end}}
        </span>
      </tr>
      <div >
        <tr >
          <td class="col-md-2"><span ng-if="countOfServicesCodes != 0" > number:</span></td>
          <td class="col-md-2"><text class="text-info">{{countOfServicesCodesByElements.count}}</text></td>
        </tr>
      </div>
    </table>
  </div>

最佳答案

ngRepeat提供了几个属性,一个是 $index。您可以在循环第一个数组时使用此类属性来打印第二个数组的所需值。像这样:

<li ng-repeat="arr1 in countOfServicesCodesParts">
    <span>{{countOfServicesCodesByElements[$index].count}}</span>
</li>

请记住,理想情况下,这适用于相同长度的数组!

关于javascript - 如何对多个对象数组使用 ng-repeat?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41016401/

相关文章:

javascript - 使用jQuery将元素移动到倒数第二个h2之前

html - 如何使用 LESS 查找嵌套类

javascript - 展开/折叠表格行

javascript - 一个 Controller 如何从另一个 Controller 获取值(value)?

javascript - 练习 Javascript 循环或优化

javascript - 从函数中传递的提交表单中获取字段值

javascript - Vue.js:使用带有 v-for 循环和 v-if 的动态创建的 v-model 来显示/隐藏元素

javascript - WordPress : Change name in my button from 'LOGOUT' to the name of the user?

javascript - Angularjs嵌套中继器中项目的ID值

javascript - Angular JS : include partial HTML inside another ng-include