对关联的数组数组进行ng-repeat?

时间:2016-05-23 20:37:45

标签: javascript arrays angularjs angularjs-ng-repeat ng-repeat

我正在尝试使用关联的数组数组在角度设置嵌套重复。例如,我有一个结构:

collections ['key1'] = [obj1,obj2,obj3,obj4];

collections ['key2'] = [obj5,obj6,obj7];

我想要一个结构为:

的视图

<div ng-repeat="collection in collections">
  <h4>{{collection.id}}</h4>
  <div ng-repeat="item in collection">
     <span>{{item.name | item.value}}</span>
  </div>
</div>

但是,只要我添加ng-repeat =“集合中的集合”,我的视图就会变为空白。有没有办法以角度执行此操作或者我是否需要更新我存储数据的方式,如果我想以这种方式循环它?感谢。

1 个答案:

答案 0 :(得分:1)

只是给你一个如何使用它的例子

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.school = {
      classes:[
        {name:"Class 1", peoples:["Peter","Sue","Marc"]},
        {name:"Class 2", peoples:["John","Edward","Sara"]}
      ]
    }
});
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">
 
<div ng-repeat="class in school.classes">
  <h4>{{class.name}}</h4>
  <div ng-repeat="person in class.peoples">
    <label>{{person}}</label>
  </div>
  <br>
</div>
</div>

</body>
</html>