需要在ng-repeat AngularJs中显示更深的项目

时间:2016-12-27 09:35:36

标签: javascript angularjs angularjs-ng-repeat

从服务器获取对象。看起来像这样:

"courses": [
      {
        "id": 1,
        "name": "piano",


        "classes": [
          {
            "id": 1,
            "name": "piano1",

          },
          {
            "id": 2,
            "name": "piano2",

          }
        ],
        "classes_count": 2,
        "feedbacks_count": 4
      },
]

JS:我在那里获得数据到Scope

httpService.getService(url, data).then(function(res) {
    $scope.datas = res.body.courses;
    console.log($scope.datas);
})

我需要在ng-repeat中打印类ID。试着这样做

<ul  class="dropdown-list" style="display: none;">
    <li ng-repeat="course in datas | filter:{'id': showprofile}:true ">{{course.classes.id}}</li>
</ul>

但是当我打印{{course.classes}}并且我得到一个包含2个对象的数组时它才有效。如何在“li”元素course.classes.id中显示?

2 个答案:

答案 0 :(得分:2)

您需要为嵌套元素添加另一个循环

<ul  class="dropdown-list" style="display: none;">
   <li ng-repeat="course in datas" ng-if='$first'> {{course.id}}</li>//
      <ul ng-if="course.classes.length">
         <li ng-repeat="classes in course">     {{course.classes.id}}</li>
      </ul>
 </ul>

答案 1 :(得分:2)

你有数组中的数组,所以你有2 ng重复:首先迭代课程,第二课程。

<ul ng-repeat="course in datas" class="dropdown-list" style="display: none;">
     <li ng-repeat="class in course.classes">{{class.id}}</li>
</ul>